Of ChaichanPapa-World !

Home/Menu

ストリクトなHTMLの基礎講座

hr要素とbr要素について

◆ はじめに

論理マークアップとスタイルシートを使いこなしてくると誰もが物理マークアップ要素ではないかと疑問に思う要素、そう、hr要素とbr要素に迫ります...。

◆ hr要素

水平線(horizontal-rule)。

視覚系ユーザエージェントは罫線をレンダリングする。

<hr>
<hr style="height:10px; color: red">

◆ br要素

強制改行(Forced Line Break)。

現在のテキスト行を強制的に区切る。

br要素を全く使はないでもHTML文書を作る事ができます。なるべく段落(p要素)を使って構造化するようにしましょう。<br>
しかし、br要素の解説の章なのでテスト的に改行しました。

◆ さて...

さて、hr要素とbr要素は、ブラウザへ見栄えを整える物理マークアップ要素でしょうか...。確かに、hr要素は区切り線表示、br要素の所では改行されます。まさに、物理マークアップ要素ですね。

しかし、意味的に大きな区切りある場合に水平線を引く論理的なhr要素があってもいいし、文章を書いた人が意味的に羅列したリストを明示する論理的なbr要素があってもよさそうですが...、そのような仕様は、ありません。

ですので、hr要素は、代わりにdiv要素を使い、論理構造を明示的にマークアップし、水平線はスタイルシートで、br要素は、代わりにリスト要素を使って、論理構造を明示的にマークアップします。

また、定型詩のようなものを表示したい場合には、br要素でなく、pre要素としてマークアップを致しましょう。

参考:http://www.satoshii.org/markup/notes/2002/03b#day15-2

尚、XHTML 2.0 には、、論理的な「行」を示す line 要素型が導入されたようです。

参考:http://www.satoshii.org/markup/notes/2002/08

◆ 結論

ということで、両者、物理マークアップ要素ということでよろしいでしょうか。だれにともなく...。

◆ おわりに

論理マークアップとは、文書の部分部分を意味的にマークアップすることで、物理マークアップとは、文書の見栄えを表示的にマークアップすることです。そして、これからは、物理マークアップはぜず、論理マークアップをし、見栄えは、スタイルシートを使いましょう!

Home/Menu/HTML概説リファレンス