css的優先順序筆記

2021-09-26 21:35:49 字數 693 閱讀 3706

個人小站點:

來自《精彩絕倫的css》

1.css的優先順序我們是用選擇器的「特殊程度」:

2.數字左邊的位數更大。一般可以這樣認為:

行內樣式》id>類、偽類、偽元素》元素(label)

! important無視上面的規則--這是重要宣告,優先順序最高

當有兩個! important衝突時,又要參照標準1

3.在css中選擇性覆蓋簡寫屬性,如

border:3px dotted black;

border-left-color:red;

可以實現乙個3條邊黑色。左邊為紅色的點邊框

然而像下面寫就不會出現乙個3條邊黑色。左邊為紅色的點邊框。

border-left-color:red;

border:3px dotted black;

這是因為後面的樣式會覆蓋前面的樣式(對於相同元素),

所以當使用這種選擇性覆蓋時,確保用來覆蓋簡寫屬性的屬性出現在簡寫屬性之後。

4關於多重樣式優先順序:

一般情況下,優先順序如下:

內聯樣式)inline style > (內部樣式)internal style sheet >(外部樣式)external style sheet > 瀏覽器預設樣式

CSS學習筆記 優先順序

乙個規則的優先順序按如下規則計算 examples a 0 b 0 c 0 specificity 0 li a 0 b 0 c 1 specificity 1 ulli a 0 b 0 c 2 specificity 2 ulol li a 0 b 0 c 3 specificity 3 h1 r...

css 優先順序

當我們的css樣式中,如果同個元素有兩個或以上衝突的css規則,瀏覽器有一些基本的規則來決定哪乙個非常特殊而勝出,也就是常講的css優先順序。一般情況下,你不必擔心css樣式衝突,但對於大型而且複雜的css樣式檔案,或有很多css檔案組成的,就非常有可能產生衝突。下面我們通過2個簡單的例項來了解一下...

css優先順序

今天在使用公司內部框架的時候,發現乙個問題。我在頁面的style元素裡面寫了乙個class選擇器,可是卻不起作用。使用f12檢視,發現是當前的樣式沒有起作用,而是被框架生成的樣式代替掉了。當然,寫內嵌的樣式肯定是沒問題。可問題就是,我明明在頁面內部寫了樣式,按照常理,應該是我手寫的類選擇器的優先順序...