html hr標籤的屬性有哪些? HTML hr標籤的樣式詳解,本篇文章介紹了html中的hr標籤的定義及其屬性描述,還有關於html hr標籤的樣式使用的幾種方法
html中hr標籤定義與用法:
水平分隔線(horizontal rule)可以在視覺上將文件分隔成各個部分。
HTML
被水平線分隔的標題和段落:
<h1>This is header 1</h1> <hr /> <p>This is some text</p>
html中hr標籤可選的屬性:
html中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標籤的各種樣式使用:
網頁設計當中hr的各種樣式,如果使用得當,將會為你的頁面增色很多,以下就來詳細介紹下各種樣式和各種使用方式的方法!
我用的編輯器是eclipse,這個依照個人喜好來定,用什麼都無所謂的,就算你直接用txt也照樣能實現這裡的效果,畢竟只是靜態。
第一種:
<hr style=" height:2px;border:none;border-top:2px dotted #185598;" />
height:2px;是hr的高度
border:none;是沒有邊框
border-top:2px dotted #185598;是設定橫線的樣式
dotted 虛線 #185598 顏色
第二種:
<hr style="height:1px;border:none;border-top:1px dashed #0066CC;" />
第三種:
<hr style="height:1px;border:none;border-top:1px solid #555555;" />
第四種:
<hr style="height:3px;border:none;border-top:3px double red;" />
html中hr的各種樣式使用
第第五種:
<hr style="height:5px;border:none;border-top:5px ridge green;" />
第六種:
<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>
波浪線:
<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>
垂直線:
<hr style="height:100px; width:4px" color=orange> <hr style="filter:alpha(opacity=100,finishopacity=5,style=2); height:100px; width:5px" color=navy> <hr style="filter:alpha(opacity=0,finishopacity=100,style=2);height:100px; width:4px" color=red>
HTML 與XHTML 之間的差異
在HTML 中,
在 XHTML 中,
在 HTML 4.01 中,hr 元素的所有呈現屬性均不被贊成使用。
在 XHTML 1.0 Strict DTD 中,hr 元素的所有呈現屬性均不被支援。
【相關推薦】
html title標籤的作用是什麼?關於html title標籤的詳細介紹
html select標籤的用法你知道嗎? html select標籤屬性介紹
以上是html hr標籤的屬性有哪些? HTML hr標籤的樣式詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!