如何和何时使用CSS的,css important 兼容性

2012年 总版技术专家分年内排行榜第一2007年 总版技术专家分年内排行榜第二2006年 总版技术专家分年内排行榜第二2004年 总版技术专家分年内排行榜第二
2005年 总版技术专家分年内排行榜第三2003年 总版技术专家分年内排行榜第三2002年 总版技术专家分年内排行榜第三
2012年6月 总版技术专家分月排行榜第二
2012年6月 Web 开发大版内专家分月排行榜第一2012年5月 Web 开发大版内专家分月排行榜第一
本帖子已过去太久远了,不再提供回复功能。使用知识及遇到的问题(18)
我们都知道在css属性在不同的地方有不同的优先级,但是我们可以在css定义中的用!important限定的定义最高优先级。
下面我通过四种情况做个实例:
下面是实例代码代码里有对应的说明:
&!DOCTYPE html PUBLIC &-//W3C//DTD HTML 4.01 Transitional//EN& &http://www.w3.org/TR/html4/loose.dtd&&
&meta http-equiv=&Content-Type& content=&text/ charset=UTF-8&&
&title&Insert title here&/title&
&style type=&text/css&&
color:/*&span style=&font-family:&;&&1&/span&没加important 显示为红色
color:red!/*2加上了important属性优先级高 显示为红色
color:red!
color:/*3但是这种情况下在ie6一下ie版本会显示为蓝色但是在其他浏览器都显示为红色
/*4为了解决ie6及一下版本的兼容 把样式分开写 important的优先级高 显示为红色 */
color:red!
&p class=&p1&&1没加important&/p&
&p class=&p2&&2加了important属性&/p&
&p class=&p3&&3IE6及一下版本识别不出来&/p&
&p class=&p4&&4解决ie6及一下版本的兼容问题&/p&
&/html&下面是测试结果:
在ie6显示结果
在其他浏览器及ie6以上显示
参考知识库
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
访问:5253次
排名:千里之外
原创:51篇
(2)(1)(3)(24)(10)(7)(1)(1)(2)(1)(3)<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
您的访问请求被拒绝 403 Forbidden - ITeye技术社区
您的访问请求被拒绝
亲爱的会员,您的IP地址所在网段被ITeye拒绝服务,这可能是以下两种情况导致:
一、您所在的网段内有网络爬虫大量抓取ITeye网页,为保证其他人流畅的访问ITeye,该网段被ITeye拒绝
二、您通过某个代理服务器访问ITeye网站,该代理服务器被网络爬虫利用,大量抓取ITeye网页
请您点击按钮解除封锁&推荐这篇日记的豆列
······后使用快捷导航没有帐号?
只需一步,快速开始
查看: 4043|回复: 25
css里的!important怎么理解?
UID8026在线时间 小时积分1172帖子离线17126 天注册时间
银牌会员, 积分 1172, 距离下一级还需 1828 积分
.p_redirect {
& & background-color: #FFFFFF;
& & border: 1px solid #A3C2E0;
& & margin-right:1
& & font-size: 12px !important;
& & font-size: 13
比如这样的,直接设置一个font-size不就可以了么?搞两个出来在什么情况下有用?
UID183284在线时间 小时积分8518帖子离线17126 天注册时间
是为了兼容IE/FF
font-size: 12px !
font-size: 13
在IE里面,由于IE不理解 !important,则字体大小按照最后设定的13px展示
而FF里面, !important为提高优先级别,则字体大小按照 !important标记的12px展示
UID8026在线时间 小时积分1172帖子离线17126 天注册时间
银牌会员, 积分 1172, 距离下一级还需 1828 积分
font-size: 13直接写这么一个,IE/FF不都认识吗?
FF不认识font-size: 13这种写法吗?
UID269106在线时间 小时积分375帖子离线17126 天注册时间
中级会员, 积分 375, 距离下一级还需 125 积分
回复 #3 igonnawin 的帖子
设置两个的原因是
在 FF中显示12px的字体
在IE中显示13px的字体
如果你只设置一个font-size:13那么FF和IE中都显示13px的字体
UID123689在线时间 小时积分2564帖子离线17126 天注册时间
银牌会员, 积分 2564, 距离下一级还需 436 积分
IE也认important吧,在两个类里:
&html xmlns=&http://www.w3.org/1999/xhtml&&
&meta http-equiv=&Content-Type& content=&text/ charset=GB2312& /&
&title&&/title&
& & font-size: 12px !
& & & & .p_redirect {
& & background-color: #FFFFFF;
& & border: 1px solid #A3C2E0;
& & margin-right:1
& & font-size: 16
&p class='p_redirect pp'&你是谁啊?&/p&
UID309570在线时间 小时积分527帖子离线17126 天注册时间
高级会员, 积分 527, 距离下一级还需 473 积分
对于font-size: 12px !IE6/7/FF都可以读到font-size:12只是IE7/FF同时使得该属性优先;
因此后面的font-size: 13只能在IE6及以下版本覆盖前面的12px
UID317675在线时间 小时积分891帖子离线17126 天注册时间
高级会员, 积分 891, 距离下一级还需 109 积分
对于font-size: 12px !IE6/7/FF都可以读到font-size:12
只是IE7/FF同时使得该属性优先(为12px);
因此后面的font-size: 13只能在IE6及以下版本为13px。
参考样式表:
UID361304在线时间 小时积分1681帖子离线17126 天注册时间
银牌会员, 积分 1681, 距离下一级还需 1319 积分
写一个类 里&&
和写在2个类里&&
貌似 有点区别
UID8026在线时间 小时积分1172帖子离线17126 天注册时间
银牌会员, 积分 1172, 距离下一级还需 1828 积分
原帖由 [i]tjubao 于
09:36 发表
对于font-size: 12px !IE6/7/FF都可以读到font-size:12
只是IE7/FF同时使得该属性优先(为12px);
因此后面的font-size: 13只能在IE6及以下版本为13px。
参考样式表:
为什么要把IE6及以下版本为13px呢?
一句简单的font-size: 12px ,各个浏览器都认识,为什么搞这么麻烦,我现在还是没明白
UID351259在线时间 小时积分3550帖子离线17126 天注册时间
金牌会员, 积分 3550, 距离下一级还需 1450 积分
这个用法不一定非要用在字体上呀,假如你FF和IE在某个局部有一些不一样的话,可以利用这个HACK来解决呀
UID359877在线时间 小时积分1322帖子离线17126 天注册时间
银牌会员, 积分 1322, 距离下一级还需 1678 积分
试验一下不就成了
UID285026在线时间 小时积分1999帖子离线17126 天注册时间
银牌会员, 积分 1999, 距离下一级还需 1001 积分
IE是可以理解!important的
!important本用来提高属性的优先级别(最高)
只是ie对!important存在bug所以被当做了hack来使用
UID247901在线时间 小时积分2788帖子离线17126 天注册时间
银牌会员, 积分 2788, 距离下一级还需 212 积分
现在一般都不用这个了 因为有ie7 原本IE6/FF识别的好好的页面 用这个ie7会一塌糊涂的
UID430517在线时间 小时积分343帖子离线17126 天注册时间
中级会员, 积分 343, 距离下一级还需 157 积分
真是越搞越乱~~~~~~~~
"!important"ie6是不能识别的,而FF可以,所以用它对FF和IE6.0分别设置样式,原因是这两种浏览器中对代码的解释存在差异,因而导致有时候相同的样式却是不同的效果!
后来到了IE7"!important"又可以被识别了,所以就不能用了;
现在的做法是IE7中在样式前加&*+html&,FF则直接写,FF不能识别&*+html&这个字符串,利用这点做到样式对浏览器的兼容;不过缺点是增加了样式表的长度,拖延了载入时间~
不过最好的做法还是用JS探测浏览器的版本,然后链接不同的样式表!
UID8026在线时间 小时积分1172帖子离线17126 天注册时间
银牌会员, 积分 1172, 距离下一级还需 1828 积分
哦,原来市这样啊,麻烦的很看来。
UID436346在线时间 小时积分129帖子离线17126 天注册时间
初级会员, 积分 129, 距离下一级还需 71 积分
浏览器的兼容是要好好学习的。。。
UID361258在线时间 小时积分1971帖子离线17126 天注册时间
银牌会员, 积分 1971, 距离下一级还需 1029 积分
按照标准写,important会很少用到的,最后不用。
UID156377在线时间 小时积分1320帖子离线17126 天注册时间
银牌会员, 积分 1320, 距离下一级还需 1680 积分
样式表会有继承属性的问题,如果某些情况下要取消这个继承就需要用到这个important来提高不需要被继承的CSS属性的优先级来。
UID8026在线时间 小时积分1172帖子离线17126 天注册时间
银牌会员, 积分 1172, 距离下一级还需 1828 积分
我是这么理解的,通过实践也证实了我的理解,
首先,!important使用的主要目的是区分(IE6)和(IE7,FF),注意IE6是一类,IE7,FF这两个是一类,因为这两个对最新的css完全支持且程度类似。
其次,IE6不解析!important(所以IE6的css最新标准支持不完全),IE7,FF解析!important(支持完善)
再次,某些css某些代码在这两类浏览器里的显示是有差别的(注意这也是使用!important的主要原因所在),比如height: 21,在IE6和(IE7,FF)里显示就有差别,后者(IE7,FF)会比前者(IE6)少一个像素。
所以,为了保持各个浏览器显示效果的一致,我们使用两句话分别针对两类浏览器,
className{
height: 22px !
height: 21
height: 22px !只有IE7,FF解析
height: 21只有IE6解析
比且最终两类浏览器显示效果一致,如果不区别对待,单纯一句height: 21那么IE7,FF里显示就会少一个像素的高度。
UID387135在线时间 小时积分19帖子离线17126 天注册时间
新手上路, 积分 19, 距离下一级还需 31 积分
important IE6是识别不了的
而FF就能识别
常用于IE与FF的HACK
UID428762在线时间 小时积分24帖子离线17126 天注册时间
新手上路, 积分 24, 距离下一级还需 26 积分
回复 #1 igonnawin 的帖子
IE应该认识的吧 important
UID435149在线时间 小时积分3605帖子离线17126 天注册时间
金牌会员, 积分 3605, 距离下一级还需 1395 积分
最好不要用!
.p_redirect {
& & font-size: 12px& &&&(火狐浏览器)
& & *font-size: 13&&(IE7.0)
& &_ font-size: 14& &(IE6.0)
UID278485在线时间 小时积分3133帖子离线17126 天注册时间
金牌会员, 积分 3133, 距离下一级还需 1867 积分
代码写的标准些,基本上hack的地方很少。如果hack,我一般都是用!important,基本上都能搞定了。原因上面讲的很清楚了---ie6不识别important。
UID370207在线时间 小时积分23帖子离线17126 天注册时间
新手上路, 积分 23, 距离下一级还需 27 积分
现在没有 必要有!important
ie7支持 !important&&
不是一个好消息的说……
现在做兼容 变得更加 难了
UID369631在线时间 小时积分413帖子离线17126 天注册时间
中级会员, 积分 413, 距离下一级还需 87 积分
不建议用这个标签..
UID345958在线时间 小时积分389帖子离线17126 天注册时间
中级会员, 积分 389, 距离下一级还需 111 积分
还是头疼啊!
& &兼容性的问题~!
Powered by}

我要回帖

更多关于 css中important 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信