成人在线亚洲_国产日韩视频一区二区三区_久久久国产精品_99国内精品久久久久久久

您的位置：首頁技術文章
文章詳情頁

css3 - CSS優先級問題

瀏覽：168日期：2023-06-21 18:16:43

問題描述

一直在說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是無效的。

標簽： CSS
相關文章：