hr要素

hr要素 水平線 ブロック要素

水平の横線を表示することができます。ブロック要素で前後に改行がはいります。終了タグはなく内容を持たない空要素です。
※XHTMLの場合hrの後ろに半角の空白/で閉じます。

内容にできる要素

なし

<hr>

実際の表示

---

xhtmlの場合

xhtmlでは終了タグがない内容を持たない空要素は半角の空白/で閉じます

<hr />

cssでデザインを指定する場合

html

<hr class="a">文字</hr>

css

線の太さの指定

値には長さの単位

hr.a { height: 1px; }

横幅の指定

値には長さの単位

hr.a { width: 300px; }

水平線の配置指定

横幅を指定して配置指定が可能な場合
値には「left」左揃え「center」中央揃え「right」右揃え

hr.a { text-align: center; }

線の色(IE用)

値には色を表す値

hr.a { color: pink; }

線の色(Netscape用)

IEもheightプロパティで線の太さを3px以上にすればbackground-colorプロパティでも色を付けられるみたいです。
値には色を表す値

hr.a { background-color: #FFCC00; }

線の太さの指定

値には長さの単位

hr.a { border-width: 0; }

共通属性

指定できる共通属性

id属性 class属性 style属性 title属性 lang属性 dir属性

イベント属性

イベント属性