【HTML】hrタグで水平線を入れてコンテンツを分割する

hrタグHTML
書いてる人
あいりゅー

プログラミングを学びながら更新しています。
iPhone/iPad/Mac/Apple WatchなどのApple製品はこちらで主に更新しています。
麻雀の反省をひたすら掲載してるブログもやってます。

あいりゅーをフォローする

このページについて

このページではHTMLで使えるhrの使い方を解説しています。

hrタグ

hrは最もシンプルなタグの1つになります。明確な使用方法とかが定められているわけではありませんが、最も使われるシーンは「ドキュメント内での話題変更」です。

このタグはシンプルにドキュメント内に水平線を描画する機能を持っています。そのため、話題変更をする際に区切りとして表示することが多いです。そういう意味から、話題変更時にドキュメントを分割するという使い方が一般的かなと思っています。

hrタグの書き方

hrはシンプルに「線を引きたい場所」に入れるだけでOKです。終了タグは不要なので、たった4文字入力するだけでOKです。

<p>内容1</p>

<hr>

<p>内容2</p>

こんな感じでたった4文字入れるだけです。ブラウザ上ではこんな感じで表示されます。↓


話題変更とかで役に立つと思います。

hrタグで使える属性

hrは固有の属性を持たず、グローバル属性・イベント属性をサポートしています。

まとめ

hrはドキュメント内に水平線を入れる機能を持っています。これは話題変更の時に使用されることが多いです。

HTMLの基礎
HTMLってどんな言語?書き方やHTMLファイルの作成方法などを解説。
HTMLタグで押さえておきたいポイント3選
HTMLタグを使う上で必ず押さえておいてほしいポイント3つの解説です。
HTMLタグと属性一覧
HTMLタグと属性の一覧です。
tableタグ生成ページ
tableタグの基本形を生成できるページです。
ulタグ・olタグ生成ページ
ulタグolタグの基本形を生成できるページです。
タイトルとURLをコピーしました