css3 - CSS優先級問題
問題描述
一直在說important的優先級最高，可是下面的結果是粉色的，貌似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>
但是經過變化以后，在同一個class內部確實是最高的，我原本以為無論在哪里，只要加上important就會是最高的優先級，結果并不是這樣
<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 設定了 color，color 值就不是繼承，就沒 body 什么事
回答2：!important這個屬性不會被繼承
就是說你給body的字體顏色設置了!important，
如果子元素沒有設置其他字體顏色，就會繼承 body的顏色，但是這個繼承跟!important沒有關系。
如果子元素設置了其他字體顏色，就會以設置的字體顏色來顯示。
回答3：謝邀！
!important 提升的是指定樣式規則應用優先級，關鍵在于指定二字，好好感受一下。
而對于你前者的示例很明顯不屬于這個范圍內。
另：
color: green !important;color: pink;
這種寫法在IE6是無效的。
相關文章：
1. javascript - 關于定時器 與 防止連續點擊 問題2. javascript - 在IE中(9+)平時的樣式不生效,只有用開發者工具選中這個元素才生效,是什么原因?3. objective-c - ios百度地圖定位問題4. html - vue里面:src在IE（9-11）下不顯示圖片5. javascript - 關于這組數據如何實現 按字母列表分類展示 不改動數據結構6. javascript - 求助這種功能有什么好點的插件？7. javascript - ie11以下單擊打開不了file，雙擊可以。求解？8. html5 - rudy編譯sass的時候有中文報錯9. javascript - 寫移動端的頁面的時候，有不一快空白，是怎么回事？10. 微信開放平臺 - Android調用微信分享不顯示
網公網安備