转载自：https://www.cnblogs.com/cang12138/p/7326280.html

!important为开发者提供了一个增加样式权重的方法，比直接在元素的 style 属性中设置 CSS 声明还要高， 一般用在 CSS 覆盖 JavaScript设置上。

<!DOCTYPE HTML>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>测试!Important</title>

</head>

<style type="text/css">

    #Box div

    {

        color: red;

    }

    .important_false

    {

        color: blue;

    }

    .important_true

    {

        color: blue !important;

    }

</style>

<body>

    <div id="Box">

        <div class="important_false">

            这一行末使用important</div>

        <div class="important_true">

            这一行使用了important</div>

    </div>

</body>

</html>

效果：

CSS代码第一行设定了box里面所有div中字体色为红色，第二行和第三行都用class重新定义了自身div的字体色为蓝色，

不同的是，第二行未使用!important，而第三行使用了!

总结：

第一行字体颜色是红色，可以证明，css样式设置中，id的优先级大于class，这行字还是红色。

第二行字体颜色是蓝色，可以证明，!important的优先级最高，important_true的css样式生效，这行字变为了蓝色！

特别说明：

!important在IE6中是不被识别的，例：

.testClass{

    color:blue !important; 
    color:red;

}

这种写法在IE6下是识别不到的，.testCalss最后显示为红色，但也可以通过更改下写法让IE6识别到!important

.testClass{

    color:blue !important;

}

.testClass{

    color:red;

}

Css中的!important的更多相关文章

  1. 使用jquery修改css中带有!important的样式属性

    当CSS中含有!important的样式属性时,普通的修改方式是会出现失败的.如下: <div class="test">使用jquery修改css中带有!import ...

  2. 如何利用 jQuery 修改 css 中带有 !important 的样式属性？

    使用 jQuery 修改 css 中带有 !important 的样式属性 外部样式为: div.test { width:auto !important; overflow:auto !import ...

  3. css中的!important作用

    css中的!important作用 一.总结 1.!important:是hack, 2.!important作用:让浏览器首选执行这个语句,当对同一个对象设置了多个同类型的属性的时候,首选执行这一个 ...

  4. CSS中的!important属性用法

    关于CSS的运用技巧有很多, 今天主要探讨一下CSS中 !important 这个属性的用法.在CSS的使用中,遇到最多的问题就是不同浏览器之间的兼容问题. 由于IE并不严格执行W3C标准, 而又几乎 ...

  5. CSS 中的 !important 属性

    !important的作用就是提高指定样式属性的优先级. 一般情况下,我们对同一个元素设置样式属性的时候,对同一个属性设置了两个甚至多个值,像下面这样: p { /* 例1 */ color:red; ...

  6. css中！important的用法

    {*rule !important}这个css规则当今在网页制作的时候的普及已经非常流行了,以前我对它的理解就停留在‘浏览器是否识别阶段’ 而没有真正去研究过,可是现在发生了变化.众所周知,!impo ...

  7. CSS中"!important"的使用

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

  8. CSS中!important的优先级

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

  9. CSS中!important的使用 转

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

随机推荐

  1. HDU 5386 Cover

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5386 题目大意:给一个初始矩阵(n×n).一个目标矩阵(n×n)和m个操作,要求找到一种操作顺序,使初 ...

  2. 禁止input输入框输入指定内容

    链接: http://blog.csdn.net/xiaoya_syt/article/details/52746598

  3. 【CF1257D】Yet Another Monster Killing Problem【贪心】

    题意:给定一些怪物,每天可以选一个勇士进去打怪,每个勇士每天只能打不超过si个怪物,每个勇士只能打能力值≤pi的怪物,问最少多少天打完所有怪物 题解:贪心,每天尽可能多的去打怪,那么存一个对于长度为i ...

  4. The Factor

    The Factor Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Total ...

  5. js数组声明+split()方法

    split()方法:var words = sentence.split(' '): "hello".split("", 3) //可返回 ["h&q ...

  6. 破解Revealapp的试用时间限制

    转载自:http://jingwei6.me/2014/02/28/reveal_crack.html Revealapp作为分析iOS app UI结构的利器,还是非常称手的,89刀的价格也是物有所 ...

  7. sqlalchemy.exc.NoForeignKeysError：Can't find any foreign key relationships between

    这句话的意思是,两张表之间的外键找不到,首先看看外键设置正确了没,如果外键没问题,看看是不是_tablename_设置了没,就是再model中,定义类的时候,表格名称要_tablename_设置一下, ...

  8. ruby的next if boolean

    next相当于continue

  9. RESTful_基础知识

    目录 目录 前言 RESTful REST原则 REST的Web原则 分层系统原则 RESTful的实现 SOA 面向服务的体系结构 RPC样式 Web服务 RPC的实现过程 SOAP 简单对象访问协 ...

  10. 【转载】阿里入局，独角兽估值30亿美金，谈谈RPA是什么

    缩短法定工作时间,已成国际劳动立法趋势,全球政府都曾面对这样的议题,过往企业IT也在思考这件事,开发出更好的软件系统帮助员工,就是普遍作法,这也已经行之有年,而现阶段最有效的作法,则是要用AI来提供帮 ...