本篇文章使用最新的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的优先级的更多相关文章

  1. css中!important的优先级问题

    css中!important的优先级在主页面中写>在外部引用的css文件 之前我一直以为css的样式不管写在哪里只要加上!important那么它的优先级就是最高的,事实上并不是这样的,尤其在动 ...

  2. css 中 important 的用法

      css 中 important 的如何使用?  important对 一个良好(或者是标准)的浏览器来说,不仅仅是从顺序上提升代码的优先级,还可以用来提升class的优先级(比如firefox), ...

  3. CSS中"!important"的使用

    本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...

  4. CSS中!important的使用 转

    本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22::) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < 元素 ...

  5. Css中!important的用法

    !important为开发者提供了一个增加样式权重的方法.应当注意的是!important是对整条样式的声明,包括这个样式的属性和属性值 <!DOCTYPE HTML> <html& ...

  6. 转:css中!important的作用

    转:http://www.cnblogs.com/guoguo-15/archive/2011/08/24/2151859.html {*rule !important}这个css规则当今在网页制作的 ...

  7. CSS中!important的作用

    提升指定样式规则的应用优先权. IE6及以下浏览器有个比较显式的支持问题存在,!important在同一条规则集里不生效.请看下述代码: 示例代码: div { color: #f00 !import ...

  8. css中!important的用法总结

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 举例详解CSS中的的优先级

    计算优先级 优先级是根据由每种选择器类型构成的级联字串计算而成的.他是一个对应匹配表达式的权重. 如果优先级相同,靠后的 CSS 会应用到元素上. 注意:元素在文档树中的位置是不会影响优先级的优先级顺 ...

随机推荐

  1. MetInfo数据库结构表

    met_admin_table 表 Key 字段名称 数据类型 不为空 默认值 说明 PK id INT(11) Yes   编号   admin_type TEXT Yes   管理员类型   ad ...

  2. Oracle常用操作-----(一)

    Oracle创建约束: ALTER TABLE 表名 ADD CONSTRAINT 约束名 约束内容. [注]Oracle中的default是一个值,而sql server中的default是一个约束 ...

  3. AngularJS语法格式小结

    //创建一个最大的容器,"唯一的名字" []数组 var a=angular.module("abcd",[]); //控制器 a.controller(&qu ...

  4. linux下svn服务器安装配置与启动

    1. 采用源文件编译安装.源文件共两个,为: subversion-1.6.1.tar.gz  (subversion 源文件) subversion-deps-1.6.1.tar.gz  (subv ...

  5. animation 的属性一共有 6 个值,详细介绍在此

    animation 属性是一个简写属性,用于设置六个动画属性: animation-name animation-duration animation-timing-function animatio ...

  6. ASP.NET WEBAPI 简单CURD综合测试(asp.net MVC,json.net,sql基础存储过程和视图,sqlhelper,json解析)

    草图   真正的后端是不管前端是什么平台,用什么语言的,JSON格式的数据应该可以应对.用ASP.NET WEBAPI尝试做一个后端,实现最基本的CURD,业务逻辑和数据库操作都放在后端,前端只需要正 ...

  7. 报表控件NCReport教程:集成NCReport到Qt应用程序中

    NCReport是一款轻量级.快速.多平台.简单易用的基于Qt toolkit的C++编写的报表解决方案,目前主要包括报表渲染库和报表设计器GUI应用程序. 但是好多使用NCReport控件的朋友都不 ...

  8. Dynamics AX 2012 R2 为运行失败的批处理任务设置预警

    我们主要有两种类型的系统监视:环境健康监视和性能监视. 环境健康监视一般对系统性能影响非常小,是为了提醒潜在的问题. 性能监视通常更有侵入性.监视期间,添加一个负载到环境.因此,它可以回答特定的问题或 ...

  9. 初识Python第二天(4)

    '.isdecimal()) print('壹'.isdecimal()) print('11d'.isdecimal()) #True #False #False #只有全部为unicode数字,全 ...

  10. mysql数据库的一些用法

    mysql数据库语句 1.replace into      REPLACE INTO  (列名1,列名2,列名3) VALUES ('值1','值2','值3');      # 如果数据库中不存在 ...