css3 - CSS優(yōu)先級問題
問題描述
一直在說important的優(yōu)先級最高,可是下面的結(jié)果是粉色的,貌似important并沒有什么卵用
<head> <meta http-equiv='Content-Type' content='text/html; charset=utf-8'> <title>示例</title> <style> body { color: green !important; } .pink-text { color: pink; } </style></head><body> <h1 class='pink-text'>Hello World!</h1></body>
但是經(jīng)過變化以后,在同一個class內(nèi)部確實是最高的,我原本以為無論在哪里,只要加上important就會是最高的優(yōu)先級,結(jié)果并不是這樣
<head> <meta http-equiv='Content-Type' content='text/html; charset=utf-8'> <title>示例</title> <style> .pink-text { color: green !important; color: pink; } </style></head><body> <h1 class='pink-text'>Hello World!</h1></body>
問題解答
回答1:你的文字是在 pink-text 上的,一旦 pink-text 設(shè)定了 color,color 值就不是繼承,就沒 body 什么事
回答2:!important這個屬性不會被繼承
就是說你給body的字體顏色設(shè)置了!important,
如果子元素沒有設(shè)置其他字體顏色,就會繼承 body的顏色,但是這個繼承跟!important沒有關(guān)系。
如果子元素設(shè)置了其他字體顏色,就會以設(shè)置的字體顏色來顯示。
回答3:謝邀!
!important 提升的是指定樣式規(guī)則應(yīng)用優(yōu)先級,關(guān)鍵在于指定二字,好好感受一下。
而對于你前者的示例很明顯不屬于這個范圍內(nèi)。
另:
color: green !important;color: pink;
這種寫法在IE6是無效的。
相關(guān)文章:
1. javascript - 數(shù)組原聲方法中的一段代碼2. html - eclipse 標(biāo)簽錯誤3. 求大神幫我看看是哪里寫錯了 感謝細心解答4. php自學(xué)從哪里開始?5. javascript - 怎么實現(xiàn)移動端頁面滑動切換,從1可以滑到2 但是不能從2滑回1 這樣的效果呢?6. javascript - JS設(shè)置Video視頻對象的currentTime時出現(xiàn)了問題,IE,Edge,火狐,都可以設(shè)置,反而chrom卻...7. 數(shù)據(jù)庫 - MySQL 單表500W+數(shù)據(jù),查詢超時,如何優(yōu)化呢?8. mysql多表查詢9. phpstady在win10上運行10. javascript - 如果所有請求都放到actions 里面,那拿到的數(shù)據(jù)應(yīng)該 放在哪里,state 還是vue實例里面的data?
