<del id="cu8q2"></del>

css級聯與繼承

xorpay 發布于2019-08-30 14:15 / 2448人閱讀

摘要：級聯級聯，是的簡寫，說明級聯是非常重要的。但是一般建議不使用因為它會改變級聯的工作方式，使得調試變得困難。繼承中有些規則將會默認被子元素繼承，有些則不會。

級聯

級聯(The cascade)，CSS是Cascading Style Sheet 的簡寫，說明級聯是非常重要的。從表層來看，級聯表明CSS規則的順序問題，但是級聯遠比這個復雜，在所有的選擇器中某個選擇器定義的規則是否能夠勝出（即優先級）取決于三個元素：Importance，Specificity，Source order
①.!important聲明(Importance)

在css規則的值末尾添加"!important"能夠保證該規則優先其他規則。但是一般建議不使用"!important",因為它會改變級聯的工作方式，使得調試變得困難。

例如：

This is a paragraph.

One selector to rule them all!

②.特性值 (Specificity)
通過4個特性值來量化一個選擇器

Thousands

聲明在元素的style屬性中。特性值記為1000

Hundreds

包含在一個選擇器中的所有ID選擇器

Tens

包含在一個選擇器中的所有類選擇器，屬性選擇器，偽類選擇器

Ones

包含在一個選擇器中的所有元素選擇器，偽元素選擇器
③.代碼順序 (Source order)

如果多個競爭選擇器具有相同的重要性和特性值，代碼順序就發揮作用了，后來規則優先前面規則。

繼承（Inheritance）

CSS中有些規則將會默認被子元素繼承，有些則不會。比如font系列屬性，文本系列屬性、列表系列屬性，cursor
CSS提供了三個特殊的值用來處理繼承
1) inherit 繼承父元素的樣式
2) initial 不繼承。應用瀏覽器的默認樣式
3) unset 不設定，表現該規則本來特性，即如果該規則具有繼承屬性則繼承，否則不繼承。

GPU云服務器云服務器級聯無限級聯 ios級聯 javascript級聯

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/115887.html

CSS札記（二）：級聯與繼承

摘要：一級聯概念級聯是的簡寫，說明級聯是非常重要的。二繼承中有些規則將會默認被子元素繼承，有些則不會。應用瀏覽器的默認樣式不設定，表現該規則本來特性，即如果該規則具有繼承屬性則繼承，否則不繼承。一、級聯概念:級聯（The cascade）,CSS是Cascading Style Sheet的簡寫，說明級聯是非常重要的。從表層來看，級聯表明CSS規則的順序問題，但是級聯遠比這個復雜，在所有...

Caizhenhao 2019-08-30 14:20 評論0 收藏0
CSS札記（二）：級聯與繼承

摘要：一級聯概念級聯是的簡寫，說明級聯是非常重要的。二繼承中有些規則將會默認被子元素繼承，有些則不會。應用瀏覽器的默認樣式不設定，表現該規則本來特性，即如果該規則具有繼承屬性則繼承，否則不繼承。一、級聯概念:級聯（The cascade）,CSS是Cascading Style Sheet的簡寫，說明級聯是非常重要的。從表層來看，級聯表明CSS規則的順序問題，但是級聯遠比這個復雜，在所有...

stonezhu 2019-08-02 10:04 評論0 收藏0
容易忽略的七個CSS知識點

摘要：樣式聲明通過一個稱為級聯的過程來解釋和決定。級聯級聯可能是中最容易被弄錯的屬性之一。因此很容易認為元素的視覺邊界等于其寬度，但情況并非如此。如果你在日常工作中使用CSS，那么你的主要目標很可能集中在使事情看起來是正確的。最終得到的正確結果遠比如何實現更重要。這意味著相比正確的語法和視覺效果我們更少關注CSS的實現原理。你可能還沒有意識到，但CSS的視覺效果通常是操縱隱藏屬性的間接結...

chanthuang 2019-08-02 16:16 評論0 收藏0
容易忽略的七個CSS知識點

摘要：樣式聲明通過一個稱為級聯的過程來解釋和決定。級聯級聯可能是中最容易被弄錯的屬性之一。因此很容易認為元素的視覺邊界等于其寬度，但情況并非如此。如果你在日常工作中使用CSS，那么你的主要目標很可能集中在使事情看起來是正確的。最終得到的正確結果遠比如何實現更重要。這意味著相比正確的語法和視覺效果我們更少關注CSS的實現原理。你可能還沒有意識到，但CSS的視覺效果通常是操縱隱藏屬性的間接結...

elina 2019-08-29 18:47 評論0 收藏0