横罫線を入れてみましょう
<hr> を指定すると 横罫線が左右いっぱいに表示されます
本文と 横罫線との間隔は ブラウザの設定に依存されます
この横罫線は 太さ、長さ、左右寄せやセンタリングなども設定できますが
デフォルトの指定では センタリングされて設定されますので align center は省略することができます
| <hr> |
何も設定していない デフォルトの状態です。 |
| <hr size="○"> |
罫線の太さを ピクセルで設定します。 |
| <hr width="○"> |
罫線の長さを ピクセル または ％で設定します。 |
| <hr align="○"> |
罫線の位置を left、center、rightで それぞれ
左寄せ 中央 右寄せに設定します。 |
| <hr noshade> |
影のない 平らな罫線を引くことができます。 |
では さっそくやってみましょう
<p>何も指定していないデフォルトの設定ではこんな感じです。</p>
<hr>
<p>線の太さを 10ピクセルで設定してみました。</p>
<hr size="10">
<p>横の長さを 100ピクセルに設定しました。</p>
<hr width="100">
<p>横の長さを 50％で設定してみました。</p>
<hr width="50%">
<p>線の太さを 10ピクセル、長さを 50％、左寄せに設定してみました。</p>
<hr size="10" width="50%" align="left">
<p>影のない 平面の線で設定してみました。</p>
<hr noshade>
<p>影のない 平面の線で 太さを10ピクセル 長さを 80％で設定してみました。</p>
<hr noshade size="10" width="80%">
|
できたページは こんな感じです → 罫線のサンプルページ
|
