- ホーム /
- よく使うHTMLタグの簡単な説明（配置系）
ブロックレベル要素とインライン要素
HTMLタグはブロックレベル要素とインライン要素の2種類に分けられています。
文字や画像を上下左右に自分の思ったとおりに配置するには、要素の違いや使い方なども覚えておく必要があります。
ブロックレベル要素
その名のとおりブロックで積み上げることができるタグの事。
横幅のサイズを指定していなければ、<h2>や<h3>のように横いっぱいまで伸びます。
四方を枠線で囲んだり、枠の内側外側にすきまを空けるとか、ブロック要素同士を重ねるなど特殊な方法もあります。
ブロックレベル要素の種類
<h1>～<h6>、<div>、<p>、<ul>、<ol>、<a>
他にもたくさんありますが、特に使用頻度の高いものだけ書いてます。
インライン要素
インライン要素とは文章の中で装飾などに使うことができるタグの事
下線<u>を引いたり、太字<strong>にしたり、小さく<small>したり、取消<s>したりもできます。
ブロックレベル要素のように積み上げることはできず、改行を入れない限り横に並びます。
ただし、文字の色付けや装飾などはCSSで設定することが推奨されています。
インラインレベル要素の種類
<span>、<strong>
他にもたくさんありますが、特に使用頻度の高いものだけ書いてます。
要素の組み合わせ
ブロックレベル要素の中にインライン要素を入れるのが鉄則です。
ダンボール箱の中へ本を入れるような感じです。
箱の中へ箱を入れるのは全く問題ありませんが、本の中へ箱を入れることはできません。
つまりインライン要素で囲った中にブロックレベル要素を設定することができないという事になります。
例外の特殊タグ
よく使うHTMLタグのなかには、「＜開始タグ＞で始まり＜終了タグ＞で閉じる」という基本的なルールから外れる特殊なものもあります。
<br />は開始タグはありません。<img>は終了タグがありません。</li>,</dt>,</dd>は終了タグを省略してもよい
