CSS中!important的优先级
本篇文章使用最新的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>
<div class="testClass" style="color:red;">
测试Css中的Important
</div>
</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显示成蓝色的。
以上实例说明使用!important的css定义是拥有最高的优先级的。只是在ie6下出了一点小的bug,注意书写方式一般可以轻松避开的。
内联样式>嵌入样式>外部样式
转载于玉帝的博客,点击此处查看原网页http://www.cnblogs.com/yudy/archive/2013/05/27/3102825.html
CSS中!important的优先级的更多相关文章
- css中!important的优先级问题
css中!important的优先级在主页面中写>在外部引用的css文件 之前我一直以为css的样式不管写在哪里只要加上!important那么它的优先级就是最高的,事实上并不是这样的,尤其在动 ...
- css 中 important 的用法
css 中 important 的如何使用? important对 一个良好(或者是标准)的浏览器来说,不仅仅是从顺序上提升代码的优先级,还可以用来提升class的优先级(比如firefox), ...
- CSS中"!important"的使用
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
- CSS中!important的使用 转
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22::) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < 元素 ...
- Css中!important的用法
!important为开发者提供了一个增加样式权重的方法.应当注意的是!important是对整条样式的声明,包括这个样式的属性和属性值 <!DOCTYPE HTML> <html& ...
- 转:css中!important的作用
转:http://www.cnblogs.com/guoguo-15/archive/2011/08/24/2151859.html {*rule !important}这个css规则当今在网页制作的 ...
- CSS中!important的作用
提升指定样式规则的应用优先权. IE6及以下浏览器有个比较显式的支持问题存在,!important在同一条规则集里不生效.请看下述代码: 示例代码: div { color: #f00 !import ...
- css中!important的用法总结
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 举例详解CSS中的的优先级
计算优先级 优先级是根据由每种选择器类型构成的级联字串计算而成的.他是一个对应匹配表达式的权重. 如果优先级相同,靠后的 CSS 会应用到元素上. 注意:元素在文档树中的位置是不会影响优先级的优先级顺 ...
随机推荐
- RML-怎样的语句会被归纳为同一类型(Unique Batches)
我们知道使用RML工具分析跟踪数据(.TRC),其中的"Unique Batches",就是一个关于Batch级别的报表,Batch级别的报表针对的是存储过程或是一个TSQL Ba ...
- LUA表克隆方法归纳
lua表克隆 将lua一个表, 克隆出一份为一个独立的另外一个表. 对于一个module, 如果在require之后,获得的表对象, 不能直接修改, 例如lua缓存此表, 但是多次逻辑执行, 都使用的 ...
- Hadoop学习(5)-- Hadoop2
在Hadoop1(版本<=0.22)中,由于NameNode和JobTracker存在单点中,这制约了hadoop的发展,当集群规模超过2000台时,NameNode和JobTracker已经不 ...
- ReferenceEquals和 == 和equals()的比较
对于这几点的区别网上经常有各种答案,而且常常会出现答案之间是互相矛盾的.要嘛就是根本含糊的解释不清楚,只是把测试结果扔上来并没有言简意赅的写出他们之间的比较.难道面试的时候考官问你,你也要在纸上写一大 ...
- opencv的学习笔记1
想在周末去游泳,找了些游泳的注意事项什么的,想想还没干正事,就来继续看看opencv的使用吧,晚上看了opencv的一些基本入门的东西,打算下面主要总结CSDN上一个大牛的博文,链接如下:http:/ ...
- Linux之常用快捷键
tab:自动补齐命令或者路径 ESC+u:将字符小写变大写 ctrl+s:在终端中冻结stdin ctrl+q:在终端中恢复stdin ctrl+a:光标移动到行首 ctrl+e:光标移动到行尾 ct ...
- 【转】 MySQL与PostgreSQL:该选择哪个开源数据库?哪一个更好?
转载地址:http://www.infoq.com/cn/news/2013/12/mysql-vs-postgresql 如果打算为项目选择一款免费.开源的数据库,那么你可能会在MySQL与Post ...
- 获取gridpanel 中 checkbox的状态
最近一直在用extjs前天框架来写作项目,很少用到这个框架,过程中遇到很多麻烦, 可能就是一个小的问题会困扰你很长时间, example: 我做一个报表,要获取gridpanel中 checkbox的 ...
- ListView实现Item上下拖动交换位置 并且实现下拉刷新 上拉加载更多
ListView实现Item上下拖动交换位置 并且实现下拉刷新 上拉加载更多 package com.example.ListViewDragItem; import android.app.Ac ...
- jenkins插件开发-此路是我开
一:前置环境 1. JDK1.6+ 2. maven已安装 3. jenkins已搭建 4. eclipse已安装(并安装了maven插件) 以上环境可以百度搜索并安装 我的环境是WIN7 64位系统 ...