您好,登錄后才能下訂單哦!
這篇文章主要介紹html中hr指的是什么,文中介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們一定要看完!
在html中,hr有“水平線”的意思,是用于在頁面中創(chuàng)建一條水平線的一種標(biāo)簽。hr元素被用來分隔 HTML 頁面中的內(nèi)容,沒有結(jié)束標(biāo)簽;直接在需要分隔的元素間添加“<hr>”即可。
<hr> 標(biāo)簽定義 HTML 頁面中的主題變化(比如話題的轉(zhuǎn)移),并顯示為一條水平線。
<hr> 元素被用來分隔 HTML 頁面中的內(nèi)容(或者定義一個(gè)變化)。
說明:
在 HTML5 中,<hr> 定義內(nèi)容中的主題變化,并顯示為一條水平線。
在 HTML 4.01 中,<hr> 標(biāo)簽僅僅顯示為一條水平線。
在 HTML 中,<hr> 標(biāo)簽沒有結(jié)束標(biāo)簽。
html <hr> 標(biāo)簽的屬性
屬性 | 值 | 描述 |
---|---|---|
align | left center right | 規(guī)定 <hr> 元素的對(duì)齊方式 |
noshade | noshade | 規(guī)定 <hr> 元素的顏色呈現(xiàn)為純色。 |
size | pixels | HT規(guī)定 <hr> 元素的高度。 |
width | pixels % | 規(guī)定 <hr> 元素的寬度。 |
示例:
<h2>HTML</h2> <p>HTML 是用于描述 web 頁面的一種語言。</p> <hr> <h2>CSS</h2> <p>CSS 定義如何顯示 HTML 元素。</p>
效果圖:
可以看出就是一條黑線,一點(diǎn)都不美觀,更不用說用<hr>來美觀頁面了,這就需要用css來設(shè)置hr的樣式了。
例如:
1、css設(shè)置hr的粗細(xì)(加粗)與顏色
<hr style="border: 5px solid red;"/><!--修改的樣式--> <br /> <hr /><!--默認(rèn)的樣式-->
2、css設(shè)置hr的雙線樣式
<hr style="height:3px;border:none;border-top:3px double red;"/>
3、css設(shè)置hr的漸變樣式
html代碼:
<hr class="style-one"/> <br/> <hr class="style-two"/>
css代碼:
hr.style-one {/*透明漸變水平線*/ width:80%; margin:0 auto; border: 0; height: 4px; background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); } hr.style-two{/*漸變*/ width:80%; margin:0 auto; border: 0; height: 4px; background: #333; background-image: linear-gradient(to right, red, #333, rgb(9, 206, 91)); }
以上是“html中hr指的是什么”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對(duì)大家有幫助,更多相關(guān)知識(shí),歡迎關(guān)注億速云行業(yè)資訊頻道!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。