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 ...
随机推荐
- js requestAnimationFrame
requestAnimationFrame,Web中写动画的另一种选择 原文:https://www.cnblogs.com/Wayou/p/requestAnimationFrame.html H ...
- scala 日期格式转换
scala> val format = new java.text.SimpleDateFormat("dd-MM-yyyy") 注意MM必须要大写 format: java ...
- 2013——M笔试南京——程序
迄今只参加了M南京笔试,可惜自己不是计算机出身,还有好多东西得学啊…… M的最后一题是编程: 输入:单链表L0.L1.L2……Ln-1.Ln,将链表变为:L0.Ln.L1.Ln-1.L2…… 算法: ...
- Android： JAVA和C# 3DES加密解密
最近 一个项目.net 要调用JAVA的WEB SERVICE,数据采用3DES加密,涉及到两种语言3DES一致性的问题,下面分享一下,这里的KEY采用Base64编码,便用分发,因为Java的Byt ...
- Linux中/etc/resolv.conf文件简析
https://blog.csdn.net/lcr_happy/article/details/54867510
- Eclipse------使用Debug As时报错java.lang.IllegalStateException: Failed to read Class-Path attribute from manifest of jar file:/XXX
报错信息: java.lang.IllegalStateException: Failed to read Class-Path attribute from manifest of jar file ...
- 一段代码让DedeCMS完美兼容PHP5.4
DedeCMS V5.7版本,在本地部署后,正确登录后台的情况下页面没有任何输出和显示(错误登录或密码错误时才有显示),也没有报错.进到脚本调试,发现问题出在userLogin类所在的脚本userlo ...
- Python之虚拟环境管理
Python本身有很多个版本,第三方的Python包又有很多可用的版本,所以经常会遇到下面的问题: 运行不同的Python程序,需要使用不同版本的Python(2.x或3.x). 在同一中Python ...
- grid响应式布局
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- underscore.js定义模板遇到问题：Uncaught TypeError: Cannot read property 'replace' of undefined
代码正确缩进位置如下, extend "layout" block 'content',-> div ->'nihao' script id:"Invoice ...