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

<!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. css 中 important 的用法

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

  2. css中!important的用法总结

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

  3. 一个CSS中Z-index的用法

    一个CSS中Z-index的用法 CSS教程:彻底掌握Z-index属性     大多数的CSS属性都很容易使用.常常,当您对标记语言的元素使用CSS属性时,产生的结果会随着您刷新页面而立即呈现.而另 ...

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

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

  5. CSS学习笔记(9)--详解CSS中:nth-child的用法

    详解CSS中:nth-child的用法 前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”. 下面我将用几个典型的实 ...

  6. 转:css中!important的作用

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

  7. CSS中"!important"的使用

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

  8. 详解CSS中:nth-child的用法

    前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”. 下面我将用几个典型的实例来给大家讲解:nth-child的实际 ...

  9. CSS中!important的作用

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

随机推荐

  1. js scrollIntoViewIfNeeded

    根据 MDN的描述,Element.scrollIntoView()方法让当前的元素滚动到浏览器窗口的可视区域内. 而Element.scrollIntoViewIfNeeded()方法也是用来将不在 ...

  2. npm安装包卡住不动的解决

    最近诸事不顺,今天更新/安装nodejs各种包也全都卡在各个环节,用ie设了全局代理貌似也没什么改观,于是到网上找找有没有国内镜像站,倒是发现了cnpmjs.org这个网站被推荐比较多,看他们主页,他 ...

  3. 【NLP】文本相似度

    http://www.ruanyifeng.com/blog/2013/03/cosine_similarity.html

  4. mongoose实现批量删除和多id查询的api/方法

    删除一条数据:传入id Model.remove({ _id: 传入的id }); 删除多条数据,传入id数组,使用$in方法 Model.remove({ _id: { $in: ['aID', ' ...

  5. Unity Shader-描边效果

    原文链接:http://blog.csdn.net/puppet_master

  6. innodb分区

    当 MySQL的总记录数超过了100万后,性能会大幅下降,可以采用分区方案 分区允许根据指定的规则,跨文件系统分配单个表的多个部分.表的不同部分在不同的位置被存储为单独的表. 1.先看下innodb的 ...

  7. CCProxy序列号及注册码

    CCProxy无限用户版序列号:JHEHIHCDDAHC 注册码:15f7f78febfaee55afeafefff7cb7fdfb3

  8. Linux远程管理之SVN,VNC

    一.远程管理的基本概念 首先我们来初略的讲讲远程管理的一些基本概念.对于我们使用的计算机来说,如果是个人计算机,就没有远程管理这一概念了,想用的时候开机就能使用,而对于我们的服务器来说,就不同了,对于 ...

  9. R语言概述

    R是一个有着统计分析功能及强大作图功能的软件系统,是由Ross Ihaka和Robert Gentleman共同创立.它是属于GNU系统的一个自由.免费.源码开放的软件,同一时候也是一个用于统计计算和 ...

  10. Android实现图片缩放示例

    package com.example.demo; import android.os.Bundle; import android.app.Activity; import android.grap ...