![見出し画像](https://assets.st-note.com/production/uploads/images/119236067/rectangle_large_type_2_9f34ef787364798a3e7491530f4e238f.jpeg?width=1200)
【hr】HTML全タグ解説Vol.19
hrタグについて
区切りのタグ
今日は<hr>タグについてです。いたってシンプルな使い方です。
使い方
sectionで区切るほどではないけれど、文章を区切りたい場合に使います。hrタグを入れると、デフォルトでは水平線が引かれます。
<!DOCTYPE html>
<html lang="ja">
<head>
< !-- 中略 -->
</head>
<body>
<p>今日は○○について解説します。○○とはとても重要な要素になります。</p>
<hr>
<p>次にこちらをご覧ください。例文はこのようになります。</p>
</body>
</html>
このように、区切りたいところに挿入します。簡単ですね。
アレンジしたいときはcssで設定
線の見た目をアレンジしたいときは、cssで設定します。
hr {
width: 50%;
height: 1px;
border: none;
border-top: 1px #000000 dashed;
}
このような感じですね。
hrタグは地味ですが便利なタグです。うまく活用してください。
では今回はここまでです。ありがとうございました。
この記事が気に入ったらサポートをしてみませんか?