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 会应用到元素上. 注意:元素在文档树中的位置是不会影响优先级的优先级顺 ...
随机推荐
- 打开VS调试不进入开发的网站直接跳转到主页
重启了熟悉有卸载IE11的,搞了好几个小时 最后把电脑管家里的锁定主页打开就好了! 很久之后 我再锁上 也没有这问题了
- git如何使用 svn如何使用
git和svn是2款常用的版本控制系统. git 的功能: 1.从服务器上克隆完整的Git仓库(包括代码和版本信息)到单机上. 也就是说自己机器上有一个git仓库. 这和svn是不同的,svn是没有本 ...
- EF 之 MVC 排序,查询,分页 Sorting, Filtering, and Paging For MVC About EF
最近悟出来一个道理,在这儿分享给大家:学历代表你的过去,能力代表你的现在,学习代表你的将来. 十年河东十年河西,莫欺少年穷 学无止境,精益求精 上篇博客我们学习了EF CodeFirst增删改查 ...
- oracle rac重建控制文件
1.使用sqlplus连接到已经mount或open的rac数据库 sql> alter database backup controlfile to trace noresetlogs; 2. ...
- 亚马逊如何变成 SOA(面向服务的架构)?
阮一峰 日期: 2016年9月10日 上一篇文章,我摘录了<程序员的呐喊>.这本书有趣的内容太多,今天再摘录一段. 1. 亚马逊公司不仅是世界最大的网络书店,还是世界最大的云服务商.它是怎 ...
- Leetcode: Sort Characters By Frequency
Given a string, sort it in decreasing order based on the frequency of characters. Example 1: Input: ...
- 什么是JSP?它有哪些特点?
什么是JSP? 它有哪些特点? JSP是服务器端的一种基于java语言的网页技术,它是由一些JSP标记,java程序段以及HTML文件组成的结合体,以java语言作为其内置的脚本语言. 实质上是通 ...
- Android之ViewHolder用法
http://www.cnblogs.com/mengdd/p/3254323.html (zhuan) http://blog.csdn.net/mrzhang_happy/article/deta ...
- JSP-10-JSTL标准标签库
JSTL (jsp 标准标签库) 包含用于编写和开发JSP页面的一组标准标签,它可为用户提供一个无脚本的环境. JSTL 提供了4个主要的标签库: 核心标签库.国际化(I18N)与格式化标签库.XML ...
- linux中非root用户使用wireshark进行抓包
开始的时候我是在终端中使用sudo 命令打开 wireshark 的,因为如果不这样的话 wireshark 就没法抓包啊.偶尔抓一次包就使用这样的方式提权. 今天使用 wireshark 的时候特意 ...