原来CSS里的 !important 是如此用法

点击查看效果:

Untitled Document

.aa{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: #FF0000 !important
}
.bb{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
background-color: #FF0000;
}

以下两个DIV的样式基本一样,但是第一个的外挂(理解俺的意思就行了)样式:background-color后面加了一个 !important,所以,虽然第一个DIV行内(in line)CSS也定义了background-color,但是却是参照外挂的background-color,其它的没有指定 !important 的,就被行内的STYLE覆盖掉了.

中Class中包括:!important的样式

不包括的样式

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(0)

相关推荐

  • 如何使用jquery修改css中带有!important的样式属性

    <div class="test">使用jquery修改css中带有!important的样式属性</div> 外部样式为: div.test{ width:auto !important; overflow:auto !important } 通过 $("div.test").css("width","100px");和 $("div.test").css("width&

  • 详解CSS样式中的!important、*、_符号

    详解CSS样式中的!important.*._符号 !important.*._其实没什么用,皆是用来设置样式的优先级,但是样式的优先级你可以自行排好其先后位置来设置,然而你还是要看懂的. 我们知道,CSS写在不同的地方有不同的优先级, .css文件中的定义 < 元素style中的属性,但是如果使用!important,事情就会变得不一样. 首先,先看下面一段代码: <!DOCTYPE HTML> <html> <head> <meta http-equiv

  • 原来CSS里的 !important 是如此用法

    点击查看效果: Untitled Document .aa{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; background-color: #FF0000 !important } .bb{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; background-color: #FF0000; } 以下两个DIV的

  • 在CSS里写复杂的JavaScript脚本

    因为"{"和"}"和CSS里的 "{"与"}"冲突. 好像也不能用引号,具体没有测试. 这样一来,在CSS里写脚本就不具备灵活了,但是如果想写一个复杂的脚本到CSS里,该如何处理呢?是一个问题,经测试,可以先定义一个函数,然后在expression里调用就行了,不过由于在CSS里用了expression,所以,只能在IE里运行. 一下是示例,点击代码可运行. Untitled Document ex=function(){ i

  • vue2.0 watch里面的 deep和immediate用法说明

    deep,默认值是 false,代表是否深度监听. immediate:true代表如果在 wacth 里声明了之后,就会立即先去执行里面的handler方法,如果为 false就跟我们以前的效果一样,不会在绑定的时候就执行. computed: { btnObj() { const { sign_img, check } = this return { sign_img, check } } }, watch: { btnObj: { handler: function(newVal,oldV

  • HTML里select的CSS样式的改变

    本以为可以很简单的在CSS里像input那样的给解决,结果没想到试了一下才知道常规的CSS根本没法改变的select样式,CSS里怎么弄,select都仍然是默认的那三维的样式.于是在网上搜索了一下,才知道,原来这个select是不能用常规的方法来定义CSS样式的.要用特殊的方法来处理.相信有很多朋友在处理网页的时候都会遇到这个问题,于是找了一篇不错的文章转过来,希望对大家有帮助---- 首先要告诉大家,如果你是用css的方法,除了箭头部分,其他都可以改变,这是很令人别扭的事,因为其他的样式改了

  • window.setInterval()方法的定义和用法及offsetLeft与style.left的区别

    定义和用法 setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停地调用函数,直到 clearInterval()被调用或窗口被关闭.由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数. 提示: 1000 毫秒= 1 秒. 语法 setInterval(code,millisec,lang) 参数 描述 code 必需.要调用的函数或要执行的代码串. millisec 必须.周期

  • css技巧十条

    1.css 字体简写规则当使用css定义字体时你可能会这样做:font-size: 1em;line-height: 1.5em;font-weight: bold;font-style: italic;font-variant: small-caps;font-family: verdana,serif; 事实上你可以简写这些属性:font: 1em/1.5em bold italic small-caps verdana,serif 现在好多了吧,不过有一点要注意:使用这一简写方式你至少要指

  • 样式表CSS布局经验

    随着时间的积累这里的内容会有增加或者修改,希望下面的东西对后来的标准学习者会有些帮助,或者毫无用处. 主要的内容是在IE和MOZILLA之间的差异和容易忽视的细节,一些经典应用的最佳实现方法,应该避免违犯的错误. 由于是自己平时经验的积累,难免会出现一些错误的解释,如有幸被高人看到,请务必指出,先谢过了. ul 标签在Mozilla中默认是有padding值的,而在IE中只有margin有值. 同一个的class选择符可以在一个文档中重复出现,而id选择符却只能出现一次;对一个标签同时使用cla

  • CSS条件注释的使用详解教材

    声明:以下内容收集于网络,经才子理解后,加以整理编辑,转载请保留才子小站的链接,谢谢!!!才子手记:http://blog.54caizi.com 玩WEB重构的朋友相信都有一个同样的苦恼,那就是由于浏览器版本的不同,对CSS里某些元素的解释也不一样,才子当然也碰到同样的问题,也收集了一些解决方法,才子之前贴过两个针对浏览器版本不同而选择不同CSS的代码,有兴趣的朋友自己找找吧. 其实我们还可以利用条件注释的方法来达到类似的目的,什么是条件注释,才子也在此简单介绍一下,无非就是一些if判断啦,呵

随机推荐