Css中!important的用法
!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的用法的更多相关文章
- css 中 important 的用法
css 中 important 的如何使用? important对 一个良好(或者是标准)的浏览器来说,不仅仅是从顺序上提升代码的优先级,还可以用来提升class的优先级(比如firefox), ...
- css中!important的用法总结
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 一个CSS中Z-index的用法
一个CSS中Z-index的用法 CSS教程:彻底掌握Z-index属性 大多数的CSS属性都很容易使用.常常,当您对标记语言的元素使用CSS属性时,产生的结果会随着您刷新页面而立即呈现.而另 ...
- css中!important的优先级问题
css中!important的优先级在主页面中写>在外部引用的css文件 之前我一直以为css的样式不管写在哪里只要加上!important那么它的优先级就是最高的,事实上并不是这样的,尤其在动 ...
- CSS学习笔记(9)--详解CSS中:nth-child的用法
详解CSS中:nth-child的用法 前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”. 下面我将用几个典型的实 ...
- 转:css中!important的作用
转:http://www.cnblogs.com/guoguo-15/archive/2011/08/24/2151859.html {*rule !important}这个css规则当今在网页制作的 ...
- CSS中"!important"的使用
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
- 详解CSS中:nth-child的用法
前端的哥们想必都接触过css中一个神奇的玩意,可以轻松选取你想要的标签并给与修改添加样式,是不是很给力,它就是“:nth-child”. 下面我将用几个典型的实例来给大家讲解:nth-child的实际 ...
- CSS中!important的作用
提升指定样式规则的应用优先权. IE6及以下浏览器有个比较显式的支持问题存在,!important在同一条规则集里不生效.请看下述代码: 示例代码: div { color: #f00 !import ...
随机推荐
- Css 去除浮动
清除浮动的方法 清除浮动方法大致有两类,一类是clear:both | left | right ,另一类则是创建BFC,细分又可以分为多种. 通过在浮动元素末尾添加一个空的标签例如并设置样式为cle ...
- VC6.0在win 8.1中的安装使用
http://blog.csdn.net/liups/article/details/14646663 一.首先是win8.1的安装 本人选择的是win 8.1简体中文专业N版,文件名: cn_win ...
- highcharts系列之xAxis
xAxis定义的是x坐标轴的配置选项.默认情况下,x轴指的是水平轴,特殊指定的时候也可以作为垂直的轴使用,在多坐标系中,xAxis是有多个配置好了的轴object的数组. 下面来看一下,xAxis常用 ...
- python操作mysql数据库实现增删改查
Python 标准数据库接口为 Python DB-API,Python DB-API为开发人员提供了数据库应用编程接口. Python 数据库接口支持非常多的数据库,你可以选择适合你项目的数据库: ...
- manifest.json文件介绍
{ // 必须 "manifest_version": 2, // 清单文件的版本,这个必须写,而且必须是2 "name": "My Extensio ...
- [原] unity3d调用android版 人人sdk
开发过程 遇到天坑:纯android工程没问题,集成到unity3d中 就老提示 没登陆 .最后跟到底 发现是Util.java 中 openUrl 函数出的bug.unity3d 中调android ...
- [Algorithm] Deferred Acceptance Algorithm
约会配对问题 一.立即接受算法: 对于约会的配对,大家都去追自己最心仪的女生.而这个女生面对几位追求者,要立刻做个决定. 被拒绝的男生们调整一下心情,再去追求心中的 No. 2.以此类推. 这样做法有 ...
- Java -- Java 类集 -- 目录
13.1 认识类集 13.1.1 基本概念 13.1.2 类集框架主要接口 13.2 Collection接口 13.2.1 Collection接口的定义 13.2.2 Collection子接口的 ...
- trim思考
今天发现后台订单商品名称没有的时候出现了HTML代码,然后看了一下源代码(下图是简化版本的) <?php $name = trim('<span style="font-weig ...
- linux-nohup后台运行
先说一下linux重定向: 0.1和2分别表示标准输入.标准输出和标准错误信息输出,可以用来指定需要重定向的标准输入或输出. 在一般使用时,默认的是标准输出,既1.当我们需要特殊用途时,可以使用其他标 ...