CSS中!important的优先级
本篇文章使用最新的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的优先级的更多相关文章
- css中!important的优先级问题
css中!important的优先级在主页面中写>在外部引用的css文件 之前我一直以为css的样式不管写在哪里只要加上!important那么它的优先级就是最高的,事实上并不是这样的,尤其在动 ...
- css 中 important 的用法
css 中 important 的如何使用? important对 一个良好(或者是标准)的浏览器来说,不仅仅是从顺序上提升代码的优先级,还可以用来提升class的优先级(比如firefox), ...
- CSS中"!important"的使用
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
- CSS中!important的使用 转
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22::) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < 元素 ...
- Css中!important的用法
!important为开发者提供了一个增加样式权重的方法.应当注意的是!important是对整条样式的声明,包括这个样式的属性和属性值 <!DOCTYPE HTML> <html& ...
- 转:css中!important的作用
转:http://www.cnblogs.com/guoguo-15/archive/2011/08/24/2151859.html {*rule !important}这个css规则当今在网页制作的 ...
- CSS中!important的作用
提升指定样式规则的应用优先权. IE6及以下浏览器有个比较显式的支持问题存在,!important在同一条规则集里不生效.请看下述代码: 示例代码: div { color: #f00 !import ...
- css中!important的用法总结
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 举例详解CSS中的的优先级
计算优先级 优先级是根据由每种选择器类型构成的级联字串计算而成的.他是一个对应匹配表达式的权重. 如果优先级相同,靠后的 CSS 会应用到元素上. 注意:元素在文档树中的位置是不会影响优先级的优先级顺 ...
随机推荐
- BUG级别(优先级、严重级)定义
一.主要分类 BUG类型标准主要分两类: Ø 依据优先级分类. Ø 依据严重程度分类. 二.主要内容 依据优先级分类标准 定义 优先级:指一个BUG相对于其他BUG对于公司的影响,解决的及时性. 分类 ...
- Hadoop学习笔记: 全排序
在Hadoop中实现全排序有如下三种方法: 1. 只使用一个reducer 2. 自定义partitioner 3. 使用TotalOrderPartitioner 其中第一种方法显然违背了mapre ...
- 换手率的公司使用MQTT的框架
向换手率公司学习.该公司貌似也使用 Golang
- 服务器IP地址后修改SQL Server配置
1. 修改TCP/IP 属性的IP 地址 修改该实例的协议.修改TCP/IP协议的属性,将IP地址更新为当前的最新IP 地址.然后重启该实例. 2.查看全部侦听再检查SQL Server 实例的TCP ...
- 简明python教程 --C++程序员的视角(一):数值类型、字符串、运算符和控制流
最初的步骤 Python是大小写敏感的 任何在#符号右面的内容都是注释 >>> help('print')在“print”上使用引号,那样Python就可以理解我是希望获取关于“pr ...
- Leetcode: Number of Boomerangs
Given n points in the plane that are all pairwise distinct, a "boomerang" is a tuple of po ...
- WIN8系统安装软件时提示"扩展属性不一致"的解决方法
单位新添加了两台T440P笔记本电脑,需要安装五笔输入法,同事一直安装不上.开始以为是WIN8系统跟输入法不兼容的问题,怀疑是输入法下载有误.于是直接在输入法官网下载了输入法,问题依旧:扩展属性不一致 ...
- paper 103:ELM算法
ELM(Extreme Learning Machine)是一种新型神经网络算法,最早由Huang于2004年提出[Extreme learning machine: a new learning s ...
- @synthesize vs. @dynamic
@synthesize will generate getter and setter methods and corresponding instance variable for your pro ...
- 自己封装的json工具类
package com.develop.util; import java.util.ArrayList; import java.util.HashMap; import java.util.Ite ...