CSS：!important使用程式碼分享
- 黄舟原創
- 2017-07-27 11:11:342047瀏覽
這篇文章使用最新的IE10以及firefox與chrome測試（截止2013年5月27日22:23:22）
CSS的原理：
我們知道，CSS寫在不同的地方有不同的優先級， .css檔案中的定義< 元素style中的屬性，但是如果使用!important，事情就會變得不一樣。
首先，先看下面一段程式碼：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试Css中的!Important区别</title>
</head>
<style type="text/css">.testClass{
color:blue !important;
}</style><body>
<p class="testClass" style="color:red;">
测试Css中的Important </p></body></html>
雖然元素的style中有testClass類別的定義，但在上面的css定義中的用!important限定的定義卻是優先順序最高的，無論是在ie6-10或Firefox和Chrome表現都是一致的，都顯示藍色。
這種情況也同時可以說明ie6是可以辨識!important的，只是這個是ie6的一個缺陷吧。如果寫成下面的樣式，ie6是識別不出來的：
.testClass{
color:blue !important;
color:red;
}
這樣，在ie6下展示的時候會顯示成紅色。
當然，也可以透過以下方式讓ie6辨識：
.testClass{
color:blue !important;
}
.testClass{
color:red;
}透過以上方式也是可以讓ie6顯示成藍色的。
#以上是CSS：!important使用程式碼分享的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
上一篇：CSS解讀前端效能優化的具體分析下一篇：CSS解讀前端效能優化的具體分析