瀏覽器對於CSS不同類中的同屬性不同值優先順序問題

2022-09-25 01:42:09 字數 938 閱讀 7660

自己做點小程式的時候發現在乙個標籤中的不同兩個類給同一屬性設定了不同值的時候,最終屬性取值的特點:

上面這句話有夠拗口的,用例子程式設計客棧說明一切吧。

csstest.html:

複製**

**如下:

www.cppcns.compe html>

csstest

aaaaaaa

bbbbbbb

ccccccc

ddddddd

eeeeeee

fffffff

1.css

複製**

**如下:

.a .b .c

.d 2.css

複製**

**如下:

.e 最後在瀏覽器審查元素的時候發現:

1、第一第二段落中,滑鼠樣式都為move,字型大小都為2em,僅類b發揮了作用。

則說明:無論在標籤中class屬性裡類的順序如何,最終www.cppcns.com相同的屬性值取css檔案中宣告位置最後的那個。

2、第三第四段落中,滑鼠樣式都為progress,字型大小都5em,僅類e發揮了作用,而在載入html頁面的時候,先載入1.css,再載入2.css。

則說明:無論在標籤中class屬性裡類的順序如何,最終相同的屬性值取最後載入的css檔案中宣告位置最後的那個。

3、第五第六段落中,滑鼠樣式都為progress,字型大小都4em,類e起效,類d由於設定了!impowww.cppcns.comrtant,也起效。

則說明:設定了!important的值會優先被選取。

後來我又測試了一下,把e中的font-size也加上!important之後,字型大小會變為5em,則對於都設定了!important的屬性值來說,遵循上面的規律。

本文標題: 瀏覽器對於css不同類中的同屬性不同值優先順序問題

本文位址:

CSS相容不同瀏覽器

製作頁面的時候,由於瀏覽器的不同,對css的解析也會有所不同,從而達不到我們預期想要的頁面效果,這個時候我們就需要針對不同的瀏覽器去寫不同的css,讓它能夠同時相容不同的瀏覽器。css hank。原始 歡迎光臨!減號是ie6專有的hack 9 ie6 ie7 ie8 ie9 ie10都生效 0 ie...

css在不同瀏覽器中的寫法

比如要分辨ie6和firefox兩種瀏覽器,可以這樣寫 我在ie6中看到是紅色的,在firefox中看到是綠色的。解釋一下 上面的css在firefox中,它是認識不了後面的那個帶星號的東東是什麼的,於是將它過濾掉,不予理睬,解析得到的結果是 div,於是理所當然這個div的背景是綠色的。在ie6中...

根據不同瀏覽器寫不同css

最近幾天幫朋友弄了個簡單的生日頁面放在我的github部落格上,就有了不同瀏覽器可能發生介面的錯亂,如何解決?當然,作為乙個小白,我的思路是通過js判斷瀏覽器型別,再用jquery變換相應的樣式。事實證明是可以的。參考這裡只是進行最簡單的判別 例子 function return false if ...