css不繼承樣式的實(shí)現(xiàn)方法

這篇文章主要介紹css不繼承樣式的實(shí)現(xiàn)方法，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

css不繼承樣式的實(shí)現(xiàn)方法：首先打開(kāi)相應(yīng)的代碼文件；然后通過(guò)覆蓋的方式清空樣式；接著把不易變化的樣式部分抽離出來(lái)；最后用組合的方式應(yīng)用到不同模塊即可。

css的繼承：就是給父級(jí)設(shè)置一些屬性，子級(jí)繼承了父級(jí)的該屬性，這就是我們的css中的繼承。 官方解釋，繼承是一種規(guī)則，它允許樣式不僅應(yīng)用于特定的html標(biāo)簽元素，而且應(yīng)用于其后代元素。

有些時(shí)候，CSS繼承了父元素的樣式會(huì)很麻煩。請(qǐng)問(wèn)有何方法可以清空繼承的樣式？如何讓css不繼承樣式？

目前只能通過(guò)覆蓋的方式清空樣式

這個(gè)問(wèn)題應(yīng)該在寫(xiě)css的時(shí)候考慮到后面的問(wèn)題

一般只有通用的樣式，和結(jié)構(gòu)固定的模塊適合使用繼承來(lái)應(yīng)用css

否則的話，不應(yīng)該讓樣式隨便繼承，對(duì)于結(jié)構(gòu)或表現(xiàn)差異很小的兩個(gè)模塊，也不適合用繼承來(lái)實(shí)現(xiàn)

好點(diǎn)的方式是：把同樣的，不易變化的樣式部分抽離出來(lái)，然后用組合的方式應(yīng)用到不同模塊。

比如兩個(gè)div

<div class="a"></div>
<div class="b"></div>

可以提取出共同的樣式，放在一個(gè)聲明下：

.fixedAd {position:fixed;width:200px;height:200px;border:1px solid #ccc;}

然后對(duì)于不同的div編寫(xiě)自己的樣式：

.a {color:#ffc;background:#ccf;}
.b {color:#777;background:#999;}

最后組合的html結(jié)構(gòu)是：

<div class="a fixedAd"></div>
<div class="b fixedAd"></div>

以上是“css不繼承樣式的實(shí)現(xiàn)方法”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！