本篇文章使用最新的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. JS小数点加减乘除运算后位数增加的解决方案

    /** * 加法运算,避免数据相加小数点后产生多位数和计算精度损失. * * @param num1加数1 | num2加数2 */ function numAdd(num1, num2) { var ...

  2. 基于ArcGIS JS API的在线专题地图实现

    0 引言     专题地图是突出而深入的表示一种或几种要素或现象,即按照地图主题的要求,集中表示与主题有关内容的地图.专题地图的专题要素多种多样,分类方法也多种多样,根据专题地图表现数据的特点可分为定 ...

  3. C#实现执行多条SQl语句，实现数据库事务

    C#实现执行多条SQl语句,实现数据库事务 在数据库中使用事务的好处,相信大家都有听过银行存款的交易作为事务的一个例子.事务处理可以确保除非事务性单元内的所有操作都成功完成,否则不会永久更新面向数据的 ...

  4. android cocos2d-x for Android安装和学习笔记（请用adt-bundle21.1或以上导入）

    引用:http://weimingtom.iteye.com/blog/1483566 (20121108)注意:这篇文章用cdt编译ndk工程的内容已过时(现在可以用adt-bundle,避免配置繁 ...

  5. 关于加权的LIS问题

    蒟蒻Zigzag正在准备联赛...... 这个算是这几天做的唯一一个值得写一写的题吧.首先LIS的N^2暴力dp应该都会写,就是F[i]=Max{F[j]}+1 那么加权的就吧后面的1换成数的权值就行 ...

  6. [selector1][selector2][selectorN]

    复合属性选择器,需要同时满足多个条件时使用. 描述: 找到所有含有 id 属性,并且它的 name 属性是以 man 结尾的 HTML 代码: <input id="man-news& ...

  7. s3c2440 移值u-boot-2016.03 第4篇 支持NAND flash 识别

    1, /include/configs/smdk2440.h 中添加 #define CONFIG_CMD_NAND 编译 drivers/mtd/nand/built-in.o: In functi ...

  8. Jquery 处理字符串

    1.去掉空格var txt=$.trim($("txt1").val()); 2.转为数字 txtNum=Number($.trim(txt)) + 1; var thisEle ...

  9. Linux 中断详解 【转】

    转自:http://blog.csdn.net/tiangwan2011/article/details/7891818 原文地址 http://www.yesky.com/20010813/1921 ...

  10. android音乐播放器(Service+ContentProvider+Broadcast+Activity四大组件完成)

    1.获取音乐 1-1:获取手机中的音乐(用ContentProvider内容提供者来完成): package com.firefly.util; import java.util.ArrayList; ...