设为首页 - 加入收藏 - 网站地图 - RSS订阅 村姑网-www.cunguer.com
当前位置:首页 > 网页制作 > CSS > 正文

css中!important的用法和作用

时间:2015-12-05 19:43:42 来源:村姑网 作者:喜欢安静 阅读:57
导读:今天我们来探讨一下css中的!important属性的用法和他的作用,有什么说的不对的或者不严谨的地方还请高手留言指正。!important的作用是可以提高某样式的优先级。他的格式为:{ cssRule !important},由格式可以看出他的用法应该是放在属性定义的后面,如 .cun...

    今天我们来探讨一下css中的!important属性的用法和他的作用,有什么说的不对的或者不严谨的地方还请高手留言指正。!important的作用是可以提高某样式的优先级。他的格式为:{ cssRule !important},由格式可以看出他的用法应该是放在属性定义的后面,如 .cunguer{color:blue !important;}。而我们在实际应用中经常使用!important属性来兼容IE6、IE7、IE8和Firefox浏览器,使网页在各浏览器中显示的效果是相同的。
    现在IE7和IE8已经能够识别!important属性,所以呢,该属性主要用在兼容IE6中。网上有说ie不认‘!important’的,大错特错了(以前自己也是这么认为的),所以今天改css的时候,我只想针对firefox来做一个padding-bottom,就写了个.class{padding- bottom:6px !important;}可是却没有效果呢。原来css在同一个大括号内是让firefox优先认领,也就是说只有在同一括号内定下两个样式的时候ie不得不忽略掉它,而不是像网上大多介绍的那样直接忽略。其实!important还有保护的作用,在任何需要保护的属性后面插入它可以避免被基于特性的属性覆盖。例如:#nav a{color:red;} a{color:teal !important},通常,一个带有id名#nav的元素里的一个链接会变色为红色,因为这个#nav a比标签样式具体的多,但因为包含了!important,以为则会这个属性永远胜出。
为了更加具体的介绍!important属性的用法,还是举个例子来说明一下,请看下面的一个例子:
例一:
.liebiao{
    margin-top:10px;
    margin-top:50px;
}
例二:
.liebiao{
    margin-top:10px!important;
    margin-top:50px;
}
例一在浏览器运行时其实是按照50px来执行的,而例二在IE7、IE8、火狐(Firefox)、google浏览器下会按照10px来显示,由于IE6不能应用(但是可以识别)!important,所以在IE6下会按照40px来显示,我们就可以通过这个来做到IE6和其他浏览器兼容了,当发现IE6和其他浏览器的显示效果不同时就设置2个属性,一个加入!important属性(放在上面),另一个不添加(放在下面),如上面的2个例子那样,这样网页在IE6和其他浏览器中的效果就相同了。
本文罗里吧嗦的说了这么多,就是想说以下几点:
1、!important是用来使IE6和IE7、IE8、火狐(Firefox)、google等浏览器做兼容的。
2、不是IE6不能识别!important,而是能识别不能应用(就是不能执行使之显示)。
3、带!important的一定要放在不设置!important属性的上面,且在同一个大括号呢才有用。

《css中!important的用法和作用》地址:http://www.cunguer.com/article/202.html,本文来自村姑网,您身边的IT专家 www.cunguer.com,转载请注明出处,您的支持是我们创作的源泉~!