CSS中選擇器的權重值

2021-09-14 03:54:32 字數 1435 閱讀 3896

css 具有自己的優先順序計算方法,而不僅僅是行間》內部》外部、id>class>元素

選擇器

栗子id#id

class.class

標籤p

屬性[type='text']

偽類:hover

偽元素::first-line

相鄰選擇器、子代選擇器> +

內聯樣式,如: style="...",權值為1000

id選擇器,如:#content,權值為0100

類,偽類、屬性選擇器,如.content,權值為0010

型別選擇器、偽元素選擇器,如div p,權值為0001

萬用字元、子選擇器、相鄰選擇器等。如* > +,權值為0000

繼承的樣式沒有權值

!important的作用是提公升優先順序,換句話說。加了這句的樣式的優先順序是最高的(比內聯樣式的優先順序還高)。

我顯示紅色

ie7+和別的瀏覽器對important的這種作用的支援度都很好。只有ie6-有些bug

p        //會顯示blue
但是這並不說明ie6不支援important,只是支援上有些bug。

p

p // 這樣就會顯示的是red。說明ie6還是支援important的

!important規則被應用在乙個樣式宣告中時,該樣式宣告會覆蓋css中任何其他的宣告,無論它處在宣告列表中的哪個位置。儘管如此,!important規則還是與優先順序毫無關係。使用!important不是乙個好習慣,因為它改變了你樣式表本來的級聯規則,從而難以除錯。

在使用!important時需要注意:

如果你也熱愛分享知識,那就加入我們吧,qq群號:431679880 ~

參考:
css 選擇器權重計算規則

mdn 優先順序是如何計算的?

CSS 選擇器 權重值計算

吠犬不咬人 愛叫的狗很少咬人 善吠的狗很少咬人 今天給大家分享乙個選擇器的一些知識 important 1000 內聯樣式 1000 id選擇器 100 類,偽類 10 元素選擇器 1 選擇器 0 繼承的樣式 無 規則 1.權值一樣,就近原則,遇到上面那個第2個問題的話,就是群組選擇器,各算個的。2...

css中選擇器

選擇器描述 attribute 用於選取帶有指定屬性的元素。attribute value 用於選取帶有指定屬性和值的元素。attribute value 用於選取屬性值中包含指定詞彙的元素。attribute value 用於選取帶有以指定值開頭的屬性值的元素,該值必須是整個單詞。attribut...

css選擇器 權重

基礎選擇器 一 標籤選擇器 p h1 css不區分大小寫,建議小寫 1 所有的標籤都可以作為標籤選擇器去使用 2 無論這個標籤藏多深,一定能夠被選上 3 選擇頁面所有的,而不是具體某乙個 標籤選擇器,選擇的是頁面上所有這種型別的標籤,所以經常描述 共性 無法描述某乙個元素的 個性 的。二 id選擇器...