CSS 樣式覆蓋原理示例介紹
發(fā)布時(shí)間：2013-08-18 09:53:05 作者：佚名 
我要評(píng)論
我要評(píng)論對(duì)同一個(gè)標(biāo)簽設(shè)置多個(gè)相同屬性，但是值不一樣，結(jié)果會(huì)是怎樣呢？到底是誰覆蓋了誰，下面為大家詳細(xì)解讀，有此需求的朋友可以參考下，希望對(duì)大家有所幫助
對(duì)同一個(gè)標(biāo)簽設(shè)置多個(gè)相同屬性，但是值不一樣，那么該標(biāo)簽的屬性會(huì)根據(jù)那個(gè)設(shè)定的為標(biāo)準(zhǔn)呢？
對(duì)于同一個(gè)標(biāo)簽元素設(shè)置屬性，滿足這樣一個(gè)規(guī)則：元素單獨(dú)設(shè)置的樣式>class命名樣式>標(biāo)簽樣式。樣式override父級(jí)別的。
<style type="text/css">
#txt{ background-color:Red}
.txt{ background-color:Green}
input {background-color:Black}
</style>
<input id="txt" type="text" class="txt" />
<input type="text" class="txt" />
<input type="text" />
對(duì)于同一個(gè)標(biāo)簽元素設(shè)置屬性，滿足這樣一個(gè)規(guī)則：元素單獨(dú)設(shè)置的樣式>class命名樣式>標(biāo)簽樣式。樣式override父級(jí)別的。
復(fù)制代碼
代碼如下:<style type="text/css">
#txt{ background-color:Red}
.txt{ background-color:Green}
input {background-color:Black}
</style>
<input id="txt" type="text" class="txt" />
<input type="text" class="txt" />
<input type="text" />
相關(guān)文章
- 下面小編就為大家?guī)硪黄狢SS樣式覆蓋規(guī)則全面了解。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧，祝大家游戲愉快哦2016-08-05
- 這篇文章主要介紹了css文件中的樣式類被覆蓋，js文件中的變量未定義問題的相關(guān)資料,需要的朋友可以參考下2016-04-27
- 很多的新手朋友們對(duì)css樣式加載順序和覆蓋順序的理解有所偏差，下面用示例為大家詳細(xì)的介紹下，感興趣的朋友不要錯(cuò)過2013-12-19
CSS層疊樣式表之CSS解析機(jī)制的優(yōu)先級(jí)及樣式覆蓋問題探討
多重樣式（Multiple Styles）： 如果外部樣式、內(nèi)部樣式和內(nèi)聯(lián)樣式同時(shí)應(yīng)用于同一個(gè)元素，就是使多重樣式的情況.有個(gè)例外的情況，就是如果外部樣式放在內(nèi)部樣式的后面，則2013-02-01- 在頁面中，我們常用id、class以及內(nèi)聯(lián)樣式表來設(shè)置我們的組件CSS，在網(wǎng)頁中css樣式根據(jù)css優(yōu)先級(jí)來使用，優(yōu)先級(jí)高的會(huì)覆蓋優(yōu)先級(jí)低的css樣式，本文通過實(shí)例代碼給大家詳細(xì)2023-01-03