4回目の投稿になります。
今回は、HTMLのブロック要素とインライン要素のタグを一覧にまとめました。
※HTML5での分類は無くなったとご指摘をいただきましたので、訂正致します。勉強不足ですね・・・失礼しました。
こういった要素があったということで、このままメモとして残させていただきます。
ブロック要素とインライン要素
HTMLの要素には改行される要素(ブロック要素)と改行されない要素(インライン要素)があります。
ブロック要素
縦に積まれる性質。
ブロック要素を配置した時に前後に１行分のスペース(改行)があることを指す。
ブロック要素の中にブロック要素を入れられる。
| 要素名 | 意味・用途 | 中に入れられる要素 |
|---|---|---|
| h1 ~ h6 | 見出し | インライン要素のみ |
| p | 段落 見出し以外の文章に使われる | インライン要素のみ |
| pre | 改行や字下げを保持し、整形した通りのテキスト表示 | インライン要素のみ(img,object,big,small,font etc...文字幅を変えてしまう要素は入れられない) |
| div | Divisionの略 レイアウトを構成(グループ化)する時に使う用素 | ブロック要素、インライン要素 |
| ul | UnorderListの略 箇条書きリスト | li要素のみを１つ以上(li要素の中にブロック要素を含んで問題なし) |
| ol | OrderListの略 数字連番リスト | li要素のみを１つ以上 |
| dl | DefinitionListの略 定義を表す(用語と説明)リスト | dt要素、dd要素のみ |
| blockquote | 長めの引用文 | ブロック要素、script要素 |
| table | 表 | caption要素、colgroup要素、col要素、thead要素、tfoot要素、tbody |
| address | アドレス(連絡先)、作者情報 | インライン要素のみ |
| form | 送信フォーム部品すべて | ブロック要素、script要素 |
| fieldset | フォーム部品のグループ化 | ブロック要素、インライン要素 |
| noframes | フレーム表示されない時のコメント用 | ブロック要素、インライン要素 |
| hr | 水平線(区切り線) | 空要素タグ |
インライン要素
ブロック要素や文章のなかに含まれる要素で、前後改行されない。
横に並ぶ性質。
インライン要素の中にブロック要素は入れられない。
| 要素名 | 意味・用途 | 中に入れられる要素 |
|---|---|---|
| a | リンク | a要素を除くインライン要素のみ |
| span | 特定の範囲に使用。文字の一部分だけ色を変えたりなど。 | インライン要素のみ |
| br | 改行 | 空要素タグ |
| button | ボタン | iframe要素、input要素、select要素、textarea要素、label要素、button要素、isindex要素、a要素を除くインライン要素のみ |
| font | フォント名、色、フォントサイズを指定 | インライン要素のみ |
| b | 太字 | インライン要素のみ |
| bdo | 文字の方向 | インライン要素のみ |
| small | 小さめの文字 | インライン要素のみ(smallを入れるとさらに小さな字にできる) |
| strong | 強調(太字で表示) | インライン要素のみ |
| em | 強調(イタリックで表示) | インライン要素のみ |
| i | 斜体(イタリック) | インライン要素のみ |
| sub | 下付き文字 | インライン要素のみ |
| sup | 上付き文字 | インライン要素のみ |
| var | 変数、引数とわかるように文字表示 | インライン要素のみ |
| u | 下線 | インライン要素のみ |
| s | 取り消し(打ち消し)線 | インライン要素のみ |
| img | 画像 | 空要素タグ |
| map | イメージマップ(画像の中のリンク部分) | ブロック要素か、一つ以上のarea要素 |
| select | 選択画面入力部品 | option要素、optgroup要素 |
| input | 送信フォームの入力部品 | 空要素タグ |
| label | フォーム部品としてのラベル | label要素を除いたインライン要素のみ |
| textarea | 複数行のテキスト入力エリア | テキストのみ |
| cite | 出典、参照先(イタリックで表示) | インライン要素のみ |
| dfn | 用語解説の該当用語をイタリックで表示 | インライン要素のみ |
| q | 短めの引用文 | インライン要素のみ |
| samp | サンプル形式表示 | インライン要素のみ |
| kbd | キーボード入力文字形式として表示 | インライン要素のみ |
| code | ソースコード | インライン要素のみ |
| iframe | インラインフレームの配置用 | ブロック要素、インライン要素 |
| object | 様々な形式のデータを配置 | ブロック要素、インライン要素、param要素 |