HTMLのhrタグの属性は何ですか? HTMLのhrタグのスタイルを詳しく解説

HTML hr タグの属性は何ですか?この記事では、HTML の hr タグのスタイルの詳細な説明と、HTML の hr タグの定義と属性の説明、および HTML の hr タグのスタイルを使用するいくつかの方法を紹介します

HTML での hr タグの定義と使用法:

---

タグは HTML ページに水平線を作成します。

水平罫線を使用すると、文書を視覚的にパーツに分割できます。

HTML

---

タグの例:

水平線で区切られたタイトルと段落:

<h1 id="This-nbsp-is-nbsp-header-nbsp">This is header 1</h1>
<hr />
<p>This is some text</p>

HTML の hr タグのオプションの属性:

Web ページでの hr タグの使用:

<hr align="center">
<hr align="left">
<hr align="right">
<hr noshade="true">
<hr noshade="false">
<hr size="5">
<hr width="500px">
<hr align="left" noshade="false" size="4" width="500px" color="#ff0000">

HTML での hr タグのさまざまなスタイルの使用:

Web デザインにおける hr のさまざまなスタイルを適切に使用すると、さまざまなスタイルとさまざまな使用方法を紹介します。それ！

私が使用しているエディターは個人的な好みに基づいています。txt を直接使用しても、結局のところ、この効果は得られます。

最初のタイプ:

height:2px; は hr

border:none; はボーダーなしです

border-top:2px dotted #185598; は水平線を設定するスタイルです

line #185598 カラー

2 番目:

<hr style=" height:2px;border:none;border-top:2px dotted #185598;" />

3 番目:

<hr style="height:1px;border:none;border-top:1px dashed #0066CC;" />

4 番目:

<hr style="height:1px;border:none;border-top:1px solid #555555;" />

HTML で hr のさまざまなスタイルを使用する

5 番目:

<hr style="height:3px;border:none;border-top:3px double red;" />

6 番目:

<hr style="height:5px;border:none;border-top:5px ridge green;" />

グラデーション カラーer:

<hr style="height:10px;border:none;border-top:10px groove skyblue;" />
border-top:10px groove skyblue;    groove  上颜色        skyblue   下颜色

中央の透明な仕切り:

<hr style="filter:alpha(opacity=5,finishopacity=100,style=1);height:10px" color=green>
<hr style="filter:alpha(opacity=100,finishopacity=5,style=1);height:10px" color=blue>

中央の不透明区切り線:

<hr style="filter:alpha(opacity=0,finishopacity=100,style=2);height:12px" color=orange>
<hr style="filter:alpha(opacity=0,finishopacity=100,style=3);height:12px" color=#FF00FF>

波線:

<hr style="filter:alpha(opacity=100,finishopacity=0,style=2);height:15px" color=yellow>
<hr style="filter:alpha(opacity=100,finishopacity=0,style=3);height:15px" color=#00FFFF>

3色の線:

<hr style="filter:wave(strength=9,freq=2,lightstrength=20,phase=9);height:15px" color=pink width=95%>

点線:

<hr style="border-top: #ff0000 solid; color: #00ff00; border-bottom: #0000ff solid; height: 9px">

縦線:

<hr style="border-top: 2px dashed; border-bottom: 2px dashed; height: 2px" color=black>

XHTMLとの違いを含むHTML

、< ;hr> タグには終了タグがありません。

XHTML では、

---

のように

---

を正しく閉じる必要があります。

HTML 4.01 では、hr 要素のすべてのレンダリング属性が非推奨になりました。

XHTML 1.0 Strict DTD では、hr 要素のすべてのレンダリング属性はサポートされていません。

【関連おすすめ】

HTMLのタイトルタグの役割とは？ htmlのtitleタグを詳しく紹介

htmlのselectタグの使い方をご存知ですか？ HTML 選択タグ属性の紹介

以上がHTMLのhrタグの属性は何ですか? HTMLのhrタグのスタイルを詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。