hr要素

段落（セクション）の区切りを表します。同じような役割を持つsection要素もありますが、hr要素はもう少し細かい単位で区切りたい場合、またはグルーピングまではしたくない場合などに使用します。

サンプルコード

<h1>サンプルコード</h1>
<p>サンプルテキスト。サンプルテキスト。サンプルテキスト。</p>
<hr>
<p>サンプルテキスト。サンプルテキスト。サンプルテキスト。</p>
<hr>
<p>サンプルテキスト。サンプルテキスト。サンプルテキスト。</p>

カテゴリー

フローコンテンツ
コンテンツモデル

なし
使用ケース

フローコンテンツが期待される場所

属性

グローバル属性: グローバル属性のみ使用することができます。
グローバル属性について詳しくは、「HTMLのグローバル属性」をご覧ください。

使用例

話題を変えるタイミングなどで使用する例です。

<article>
	<h1>アラスカからコーヒー豆が届きました。</h1>
	<p><b class="lead">極寒の地、アラスカ。オーロラでも有名な、自然豊かな土地です。<br>そんな場所で育まれた、美味しいコーヒーをご紹介します。</b></p>
	<figure>
		<img src="../alaska_coffee.jpg" alt="alaska_coffee">
	</figure>
	<hr>
	<h2>豆のご紹介</h2>
	<p>まずは特徴をご紹介していきます。<br>苦味はそこまで強くありませんが、少し酸味はあります。</p>
	<p>特徴はその香りで、なんとカカオフレーバーに仕立てられており...</p>
</article>

ブラウザでの表示例

こちらの記事は役に立ちましたか？

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

コメントありがとうございます！
運営の参考にさせていただきます。