使い方

HTMLは文書を構造化するための言語です。文書がどのような構造になっているのかを、タグというもので囲むことによって表します。簡単に言えば、段落なら段落のタグを使って囲み、見出しなら見出しのタグを使って囲むだけです。例えば、次のようになります。

<h1>サンプル</h1>

上の例では見出しを表すタグを使って囲んでいます。これで、「サンプル」という文字が見出しを表すものとして定義づけられました。

ここで、<h1>を開始タグ、</h1>を終了タグ、中の文字を含めた全体を要素と呼び、全て半角英数字で表記します。h1は要素名と言い、ここでタグの種類を表しています。

HTMLでは開始タグ・終了タグで囲むことで意味を表します。これが基本的なことになり、後はどのような種類のタグを使って書くか、どのような入れ子構造にするかを決めるだけで文書を構成することができます。

表示

テキストエディタに上の例のように書いて、sample.htmlなどのように名前を付けて保存します。そして、ファイルをブラウザで開くと書いた内容が表示されます。

上の例では「サンプル」という文字が大きく表示されますが、<h1>は文字を大きくするという要素ではありません。単に見出しを構成するという要素であるにすぎません。一般に、この構造を表すということが分かっていない人が多いようです。文字の色や大きさを変えたい場合はCSSでレイアウトを構成することができます。

属性

要素には、要素の特性を書くこともできます。これを属性と言い、「属性="値"」というように書きます。開始タグの後に半角スペースで区切ることにより、複数指定することもできます。要素によっては、属性を指定することが必須になっている場合もあります。以下にどの要素にも指定できる属性を示します。

id
要素に固定の名前 (同一ページに一つの名前) を指定できます。CSSの指定の時に役立ちます。
class
要素に一般的な名前を指定できます。CSSの指定に役立ちます。
title
要素に補足情報を示す場合に指定。指定した要素の上にポインターをのせると、内容が表示されます。
style
要素にCSSを指定できます。一時的にCSSを試すときに役立ちます。

スペースや改行

HTMLファイル内に半角スペースやタブや改行などを連続で書いたとしても、ブラウザで表示されるときは半角スペース１つとして表示されるようになっています。ただし、開始タグの直後と終了タグの直前の改行は無視されるので、自分の見やすいように入れ子関係を表すためにインデント (字下げ) することができます。

ブロック要素とインライン要素

HTMLの要素は、ブロック要素とインライン要素の二種類に分けることができます。インライン要素はそれ独自で使うことはできず、ブロック要素の中にいれて使います。以下に例を挙げます。

ブロック要素

インライン要素