【HTML】<hr>要素を使って区切り線(水平線)を引いてみよう

【HTML】<hr>要素を使って区切り線(水平線)を引いてみよう

<hr>要素とは?

<hr>要素はHTMLで水平線を引くためのタグです。
ページ内のコンテンツの区切りや分割を視覚的に示す事に使用します。

<hr>

<hr>要素の使用例

〇基本的な使い方

<hr>

<hr>と記述するだけで水平線が表示されます。
特に設定しなければ左右100%で線が表示される事になります。

styleを加えてみた

<hr>要素にはstyleで装飾する事ができます。

例1

<hr style="border: 3px solid #e02525; width: 200px; margin: 20px auto 20px 0;">

線を3pxに太くして色を赤(#e02525)に、幅を200pxにして線を左寄せ、上下に20pxのマージンをとってみました。

例2

<hr width="200" size="15" align="left">

幅を200pxにしてサイズを15にして、線を左寄せにしてみました。