简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首页 > web前端 > css教程 > 正文

CSS：!important使用代码分享

黄舟
发布： 2017-07-27 11:11:34
原创
1994 人浏览过

本篇文章使用最新的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中文网其他相关文章！

相关标签：
css important
来源：php.cn
上一篇：CSS解读前端性能优化的具体分析 下一篇：CSS中关于!important的使用方法总结
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
如何使用文本溢出防止断字 我正在尝试为某些标题设置最大行数，但问题是有时一行会以断词结尾。我需要的是，如果一个单词必须被打破，它应该被完全隐藏，并且省略号放在前一个单词之后。此代码显示了问题：#head{w...
来自于 2023-09-03 15:00:49
0
1
287
如何使用z-index将下拉内容放在最顶层？ 一个下拉式div元素，在移动视图中应该像这样工作，但在检查元素中却显示为移动视图。我试过改变几乎所有相关导航元素的CSSz-index样式，将这个元素保留在“z-index:121...
来自于 2023-08-31 23:37:47
0
1
225
使用 CSS 更改 HTML 输入的占位符颜色 Chromev4支持input[type=text]元素上的占位符属性（其他可能也这样做）。但是，以下CSS不会对占位符的值执行任何操作：input[placeholder],[p...
来自于 2023-08-27 11:17:26
0
2
224
标题重写为：vuetify select placeholder color 的中文翻译是 "vuetify 选择框中的占位符颜色" 我正在尝试更改vuetify选择框的占位符文本颜色。我的尝试如下：<v-select:items="items"placeholder="pla...
来自于 2023-08-25 17:38:21
0
1
214
如何覆盖！重要？ 我创建了一个自定义样式表，它覆盖了我的WordPress模板的原始CSS。但是，在我的日历页面上，原始CSS使用!important声明设置了每个表格单元格的高度：td{heigh...
来自于 2023-08-23 18:46:30
0
2
236
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！