请选择 进入手机版 | 继续访问电脑版
收藏本站腾讯微博新浪微博
点点网模板设计大赛 phpchina

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 用悬赏 三天解决问题 解决访问速度慢 论坛支持农历生日 - 给官方提建议

论坛活动及任务 归纳网站最新活动 地图任务 邮件更新任务:保护帐号安全

积分换实物,来参加蓝色理想积分兑换吧! 联系招聘客服 蓝色理想帮你找工作! 万元奖励等你拿——点点网模板设计大赛

查看: 5420|回复: 14

[教程] [翻译]关于!important在ie7.0的hack方法 [复制链接]

x2hu 楼主
帖子
66
体力
376
威望
3
发表于 2006-4-29 23:19:00 |显示全部楼层
由于ie对!important识别存在bug,而现在大部分网页标准设计师又通过这个bug来兼容ie和ff,但是ie7.0把这个bug给修复了,所以问题又出现了,怎么兼容ie.7.0的同时又能兼容ie6.0和ff?正所谓"上有政策,下有对策",国外的网页标准设计师通过使用css filter的办法(并不是css hack)来兼容ie7.0,ie6.0和ff,以下为我从国外网站的翻译.

新建一个css样式如下

  1. #item {
  2.     width: 200px;
  3.     height: 200px;
  4.     background: red;
  5. }
复制代码


新建一个div,并使用前面定义的css的样式
  1. <div id="item">some text here</div>
复制代码


在body表现这里加入lang属性,中文为zh

  1. <body lang="en">
复制代码


现在对div元素再定义一个样式

  1. *:lang(en) #item{
  2.     background:green !important;
  3. }
复制代码


这样做是为了用!important覆盖原来的css样式,由于:lang选择器ie7.0并不支持,所以对这句话不会有任何作用,于是也达到了ie6.0下同样的效果,但是很不幸地的是,safari同样不支持此属性,所以需要加入以下css样式.

  1. #item:empty {
  2.     background: green !important
  3. }
复制代码


:empty选择器为css3的规范,尽管safari并不支持此规范,但是还是会选择此元素,不管是否此元素存在,现在绿色会现在在除ie各版本以外的浏览器上,并在以下浏览器和操作系统下通过测试:

ie7 beta 2 preview/win
ie5.01+/win
firefox 1.5/win
opera 8.5/win & linux
netscape 7.01, 8/win
mozilla 1.7.12/win & linux
safari 2/mac
firefox 1.0.4/linux
epiphany 1.4.8/linux
galeon 1.3.20/linux





按照远作者的说法其实这不能算是一种hack,应该属于filter,不过这似乎并不是最重要的,因为通过这个办法,我们又一次了解决IE6.0,IE7.0和其他浏览器之间的兼容性问题,而且使用:lang-filter这办法,在今后的一段时间内都会有用

原文地址:http://www.ibloomstudios.com/article7/
已有 1 人评分威望 收起 理由
经典论坛大妈 + 3 历史打分

总评分: 威望 + 3   查看全部评分

my blog - x2-blog
西部数码顶级域名注册商39元抢注!
小毅 

悟禅布衣

荣誉管理

帖子
1137
体力
10273
威望
218
居住地
广东省 广州市
发表于 2006-4-30 06:28:00 |显示全部楼层
辛苦楼主翻译此文,随着IE7的到来,我们需要应对的真是越来越多。如果浏览器的升级不断但是又依然不合标准,那么会有很多标准学习者会退出。

但愿IE7不要出现太大的问题!
租服务器,上51IDC | [长沙]招聘:PHP经理10K/WEB前端6K/PHP开发6K

使用道具 举报

x2hu 楼主
帖子
66
体力
376
威望
3
发表于 2006-4-30 07:59:00 |显示全部楼层
确实如此,但是包括原作者和我翻译的目的,都不是鼓励多用!important,更多是为了保持浏览器之间的兼容性,不得以的办法,因为部分浏览器本身在CSS的样式定义上就存在一定的差异,这个办法在IE7.0正式发布以后还是有用的
my blog - x2-blog

使用道具 举报

帖子
128
体力
475
威望
0
发表于 2006-8-13 13:33:51 |显示全部楼层
听着听着...唉..好象有点心灰意冷..

使用道具 举报

帖子
22
体力
176
威望
0
发表于 2006-11-27 15:10:35 |显示全部楼层
新手
学习一下

使用道具 举报

txqing 
帖子
104
体力
202
威望
0
居住地
四川省 成都市
发表于 2006-12-7 15:02:27 |显示全部楼层
从现在开始,把网站上面都挂一个下载firefox的图标吧,希望有一天firefox可以打败IE

使用道具 举报

zxfly 
帖子
872
体力
2081
威望
0
居住地
福建省 厦门市
发表于 2006-12-7 15:06:12 |显示全部楼层
我现在已经抛弃!important的hack方法,!important就用来提升class的优先级

使用道具 举报

帖子
49
体力
94
威望
1
发表于 2006-12-7 15:36:38 |显示全部楼层

打倒微软!! 支持Firefox !!

原帖由 小毅 于 2006-4-30 06:28 发表
辛苦楼主翻译此文,随着IE7的到来,我们需要应对的真是越来越多。如果浏览器的升级不断但是又依然不合标准,那么会有很多标准学习者会退出。

但愿IE7不要出现太大的问题!



    哈哈,真是个头痛的问题
    我是不会退出标准的学习的,  是WEB标准的坚定支持者.毕竟体会到了它的强大与方便.

    但是,非常讨厌微软的IE,IE的漏洞使机子常中毒,或者被强制安装了流氓软件.IE升级虽然功能更强大,但留下的问题好像更多,这些问题让网页设计人员头痛.浏览器厂家又是见利忘义的家伙.我现在基本上是用FF浏览网页,IE只在调试网页时使用。

     所以最苦的就是设计人员了,越追求完美的设计师,越辛苦.唉

    抵制IE!!   支持Firefox   !!

[ 本帖最后由 xhtmlcss2006 于 2006-12-7 16:00 编辑 ]
观物于微  积小成大

使用道具 举报

经典零零八

银牌会员 手机认证 

帖子
1300
体力
2711
威望
1
居住地
浙江省 金华市
发表于 2006-12-8 11:12:17 |显示全部楼层
我装的IE7 怎么!important的hack方法还能用啊。。。是正式中文版的。。郁闷。。。
来生还做兄弟

使用道具 举报

个性猪

银牌会员 手机认证 

帖子
458
体力
1215
威望
0
居住地
广东省 深圳市
发表于 2006-12-17 15:10:19 |显示全部楼层
新手,值得学习学习

使用道具 举报

缘客

银牌会员

帖子
199
体力
1011
威望
0
居住地
黑龙江省 哈尔滨市
发表于 2006-12-17 16:21:43 |显示全部楼层
问题得一点点解决,让我们坚持到真正的标准化吧

使用道具 举报

月亮上的狗

银牌会员

帖子
745
体力
2627
威望
0
居住地
江苏省 苏州市
发表于 2006-12-17 20:56:58 |显示全部楼层
基本明白楼主的意思了  呵呵 真是复杂了  本来只要兼容下  ie和ff(有时发现opera也会出现类似ie7的问题)

现在真有的头大了   怪不得大多数商业网站都不合标准  毕竟时间就是金钱啊!~没那么多时间去测试的

使用道具 举报

oivp 

痴儿

银牌会员 手机认证 

帖子
1451
体力
1894
威望
0
发表于 2006-12-18 09:10:20 |显示全部楼层
只要项目不是那么复杂 很容易兼容 IE FF OP的 我很少用所谓的 hack 如果出问题首先想到的就是加个补丁 无益呀

使用道具 举报

帖子
8
体力
22
威望
0
发表于 2006-12-29 18:08:57 |显示全部楼层
问个问题:
#top { width:100px!important; width:400px; width/**/:800px; background:blue;}
在FF,IE6,IE5.X显示宽度各会是多少啊?
!important提高优先级在这里表现在哪啊?
糊涂了已经。

使用道具 举报

Hoowir 
帖子
63
体力
155
威望
0
居住地
浙江省 宁波市
发表于 2007-2-9 23:28:16 |显示全部楼层
用IE人太多....不兼容IE网站就没钱途鸟~~~

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

Archiver|手机版|安久科技提供CDN|blueidea.com ( 京ICP备05002321号 )  

GMT+8, 2012-2-11 04:40 , Processed in 0.111137 second(s), 11 queries , Gzip On, Memcache On.

Powered by Discuz! X2

© 2001-2011 Comsenz Inc.

回顶部