hrタグ

タグhrは区切りの水平線を設定します。 このタグの利点は、単一の線を引くために 余分なブロックを作成する必要がないことです。 終了タグは必要ありません。

例

タグhrの動作を見てみましょう:

:

例

CSSプロパティborder-colorを使って 線の色を変更してみましょう:

:

例

線の色は、プロパティcolorでも 変更できます(ただし、colorとborder-colorが 同時に指定されている場合、後者が優先されます):

:

例

CSSプロパティborderを使って 線の色を変更してみましょう。 これにより、線が二重の太さになることに注意してください (上と下の両方に枠線を設定したためです):

:

例

CSSプロパティborder-topを使って 線の色を変更し、上部の枠線だけを設定してみましょう。 これで二重線にはなりません:

:

例

CSSプロパティborder-topを使って、 値をsolidの代わりにdottedに設定し、 点線の線を作成してみましょう:

:

例

CSSプロパティborder-widthを使って 線の太さを増やしてみましょう:

:

例

ここで、線に高さheightを追加し、 borderで枠線を設定してみましょう。 これにより、枠線は上部と下部に分割されます:

:

関連項目