Css中的!important
转载自: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的更多相关文章
- 使用jquery修改css中带有!important的样式属性
当CSS中含有!important的样式属性时,普通的修改方式是会出现失败的.如下: <div class="test">使用jquery修改css中带有!import ...
- 如何利用 jQuery 修改 css 中带有 !important 的样式属性?
使用 jQuery 修改 css 中带有 !important 的样式属性 外部样式为: div.test { width:auto !important; overflow:auto !import ...
- css中的!important作用
css中的!important作用 一.总结 1.!important:是hack, 2.!important作用:让浏览器首选执行这个语句,当对同一个对象设置了多个同类型的属性的时候,首选执行这一个 ...
- CSS中的!important属性用法
关于CSS的运用技巧有很多, 今天主要探讨一下CSS中 !important 这个属性的用法.在CSS的使用中,遇到最多的问题就是不同浏览器之间的兼容问题. 由于IE并不严格执行W3C标准, 而又几乎 ...
- CSS 中的 !important 属性
!important的作用就是提高指定样式属性的优先级. 一般情况下,我们对同一个元素设置样式属性的时候,对同一个属性设置了两个甚至多个值,像下面这样: p { /* 例1 */ color:red; ...
- css中!important的用法
{*rule !important}这个css规则当今在网页制作的时候的普及已经非常流行了,以前我对它的理解就停留在‘浏览器是否识别阶段’ 而没有真正去研究过,可是现在发生了变化.众所周知,!impo ...
- CSS中"!important"的使用
本篇文章使用最新的IE10以及firefox与chrome测试(截止2013年5月27日22:23:22) CSS的原理: 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < ...
- 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文件中的定义 < 元素 ...
随机推荐
- openGL常用对象的创建及使用
一.GPU英文全称Graphic Processing Unit,中文翻译为“图形处理器”.GPU(显卡核心芯片)是显示卡的“大脑”,它决定了该显卡的档次和大部分性能 二.使用背景 随着OpenGL状 ...
- 【串线篇】spring boot全面接管springMvc
一.Spring MVC auto-configuration Spring Boot 自动配置好了SpringMVC 以下是SpringBoot对SpringMVC的默认配置:(WebMvcAutoC ...
- bzoj4448 [Scoi2015]情报传递 主席树+树上差分
题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=4448 题解 练习一下主席树的基础练习题找回感觉. 对于每一次询问,第一问显然随便做. 第二问的 ...
- 使用Fabric在tomcat中部署应用的问题总结
关闭tomcat时 A.为什么调用shutdown时,报错连接拒绝 结论——很可能是因为tomcat没启动或没完全启动:而这个时候调用shutdown就会出现此类报错 解决方法:time.sleep ...
- [洛谷P3205] HNOI2010 合唱队
问题描述 为了在即将到来的晚会上有更好的演出效果,作为AAA合唱队负责人的小A需要将合唱队的人根据他们的身高排出一个队形.假定合唱队一共N个人,第i个人的身高为Hi米(1000<=Hi<= ...
- 【leetcode】394. Decode String
题目如下: 解题思路:这种题目和四则运算,去括号的题目很类似.解法也差不多. 代码如下: class Solution(object): def decodeString(self, s): &quo ...
- MyCAT操作MySQL示例之E-R表
接着上一篇继续..... E-R 关系的数据分片策略,子表的记录与所关联的父表记录存放在同一个数据分片上,即子表依赖于父表,通过表分组(Table Group)保证数据 Join 不会跨库操作. 表分 ...
- HashMap接口测试
package com.iotek.map; import java.util.Collection;import java.util.HashMap;import java.util.Map;imp ...
- java 简单指令说明
javac:Java编译器,Java程序的编译工具,用来将Java程序的源文件编译成字节码文件,也就是.class文件.java:Java解释器,解释和执行已经转换成字节码的Java应用程序.jdb: ...
- 攻防世界 | level0
先反编译 : int __cdecl main(int argc, const char **argv, const char **envp) { write(1, "Hello, Worl ...