IE8的css hack

愚人码头 撰写  

首先感谢“丸子”提供的这个IE8的css hack;

关注过IE8的css hack的人相信大家都在使用这个hack,就是“\9”的css hack:

.test{
color:#000000;                  /* FF,OP支持 */
color:#0000FF\9;       /* 所有IE浏览器(ie6+)支持 ;但是IE8不能识别“*”和“_”的css hack;所以我们可以这样写hack */
[color:#000000;color:#00FF00;      /* SF,CH支持 */
*color:#FFFF00;                 /* IE7支持 */
_color:#FF0000;               /* IE6支持 */
}

包括我自己也是使用这种的,这是我前段时间整理的《主流浏览器的一些CSS hack》。(转载请注明出处:WEB前端开发 http://www.css88.com/)

很多人再研究color:#0000FF\9;中的为什么IE6-IE8支持“\9”写法,和它的原理,我只是个工程师,不是科学家,我不懂为什么和它的真正原理,真的!很惭愧!

昨天在某个群里也看到部分前端工程师或网页重构师势利的一面,同样的一个解决方案,大公司有名的前端工程师或网页重构师写的东西都追捧,而小公司没名气的前端工程师或网页重构师写的解决方案却被反问:“css有这种写法吗?看来你连最基本的css的几个属性和属性值都没搞懂;就算你解决了问题你写的css也是不规范的,就是规范你跟我讲讲你解决方案的原理;”同样的一个解决方案,大公司有名的前端工程师或网页重构师写的这些反问质疑就全都没了,拼命的去研究他这个解决方案,呵呵,我觉得那些人很可笑。还有很多人问问题只有得到大公司有名的前端工程师或网页重构师的肯定回答后才放心而又开心的走了,甚至不留一句谢谢。当然没人(包括我)否认大公司有名的前端工程师或网页重构师在业界的影响力,他们为前端和重构业界做的贡献大家都是看得到的,只是觉得做人(特别是我们做技术的)不能太势利,多一点技术共享和探讨,多一点感激,学习成长才是最重要的。我承认我以前经常骂人,骂人家SB,内参国王说的对,骂人家SB就等于骂自己SB,我以前是很SB。不想探讨就看着呗,骂人是不对的!(转载请注明出处:WEB前端开发 http://www.css88.com/)

扯远了,回到IE8的CSS hack,讲讲color:#0000FF\9:

color:#0000FF\9的hack支持IE6-IE8(其他版本没有测试),但是IE8不能识别“*”和“_”的css hack,所以我们可以使用

color:#0000FF\9; ;/*ie6,ie7,ie8*/

*color:#FFFF00;/*ie7*/

_color:#FF0000;/*ie6*/

来区分IE的各个版本。

至于为什么使用“\9”我真的不清楚原因,但是“丸子”测试了其他0-13的数字,最终结果如下:

2009-07-18_125722

其中:OP表示Opera,SA表示Safari,Ch表示Chrome;当然你如果还有耐心可以测试“\14”,“\15”,“\16”。。。

从上面测试结果我们可以看出“\0”的写法只被IE8识别,ie6,ie7都不能识别,那么“\0”应该是IE8的真正hack。主流浏览器的CSS hack这样更好一些:
(转载请注明出处:WEB前端开发 http://www.css88.com/)

.test{
color:#000000;                  /* FF,OP支持 */
color:#0000FF\0;       /* IE8支持*/
[color:#000000;color:#00FF00;      /* SF,CH支持 */
*color:#FFFF00;                 /* IE7支持 */
_color:#FF0000;              /* IE6支持 */
}

其中:OP表示Opera,SA表示Safari,Ch表示Chrome;

更多相关链接:


相关日志:

刚刚被浏览过的文章:


32 条评论

  1. 发表了 2009年07月18日 在 1:22 下午 | 永久链接

    码头哥太抬举偶了..哇哈哈哈哈

  2. 发表了 2009年07月18日 在 4:48 下午 | 永久链接

    一直不想去研究hack,何必呢。早晚被淘汰的。就算要HACK, 就足够用了。

    还不如多点时间在怎么写出结构更好的CSS上。

    至于你这篇文章额外附赠的那些问题,正是我不愿意加Q群的原因…… 乱七八糟的,也讨论不出来个什么好东西。还不如直接在blog上交流来的畅快。

  3. 发表了 2009年07月18日 在 4:49 下午 | 永久链接

    一直不想去研究hack,何必呢。早晚被淘汰的。就算要HACK, 就足够用了。

    还不如多点时间在怎么写出结构更好的CSS上。

    至于你这篇文章额外附赠的那些问题,正是我不愿意加Q群的原因…… 乱七八糟的,也讨论不出来个什么好东西。还不如直接在blog上交流来的畅快。

  4. 发表了 2009年07月18日 在 4:50 下午 | 永久链接

    囧。… 显示不了.. if ie啊,我只是想说if ie…………..

  5. 发表了 2009年07月19日 在 1:59 下午 | 永久链接

    * 和 _ 这样的方法真的有效吗?就用你这篇文章的范例我测试了一下,针对IE6和IE7的hacker,无论是在IE8的quriks模式和IE7模式之下,还是在纯IE6或IE7之下都无法显示出应该有的效果。

    我就觉得纳闷了,这两种hacker我见了无数次,但我自己从来就没成功过(* 大多有效,但也并非绝对,针对IE7,用;!important也可以),反而用下面这种方法更有效:

    .test {
    color: #000; /* FF & Opera*/
    [color: #000; color: #f00 /* Safari & Chrome */
    color: #0f0; /* IE8 – it works! */
    }

    * html .test {
    color: #00f; /* IE6 */
    }

    *+ html .test {
    color: #ff0; /* IE7 */
    }

    而且这么写可通过 CSS Valid。(IE8的hacker不知可否通过验证,没空去测试了。但是我想……有必要hack IE8吗?)

  6. 发表了 2009年07月19日 在 3:08 下午 | 永久链接

    * 和 _ 这样的方法无效?这是我第一次听说!

  7. 发表了 2009年07月19日 在 3:12 下午 | 永久链接

    有人就有江湖,有ie就有hack!

  8. 发表了 2009年07月19日 在 3:20 下午 | 永久链接

    ….那个说无效的higher能否给个实例….我想学习下…

  9. 发表了 2009年07月19日 在 7:20 下午 | 永久链接

    学习了!

  10. yxq198514
    发表了 2009年07月20日 在 9:09 下午 | 永久链接

    IE8的css hack我拿到前端闭关群里没人理睬,在JS森林里被人深刻批判了,和笨活儿的说法一样,我不清楚他们为什么这么抵触HACK,个人觉得因为浏览器的原因,为了页面表现形式一样,不妨写下HACK,但假如一个站要写很多HACK就要反思一下了。当然JS判断浏览器也是一种不错的方法,但觉得为了几个HACK没必要用JS

  11. 罗里密
    发表了 2009年07月21日 在 4:10 下午 | 永久链接

    可以用,
    并通过了验证。

  12. 发表了 2009年07月22日 在 8:53 上午 | 永久链接

    据说”\9″是会被视为转义字符,在IE中被转义为一个空白字符,而非IE浏览器则不接受此形式

  13. 发表了 2009年07月22日 在 10:14 下午 | 永久链接

    为什么还要考虑为IE8写HACK,完全没有写HACK的欲望!

  14. 发表了 2009年07月23日 在 10:32 上午 | 永久链接

    “*”和“_”是绝对可以的,”* html“和“*+ html”也可以,IE8的HACK,为什么要写呢,我看大多数网站是将IE8打回IE7模式执行的,我自己的个人博客也是这样的。

  15. 发表了 2009年07月27日 在 10:08 上午 | 永久链接

    其实做好了前面的html结构工作和央视的书写,hack一般不会需要

  16. 发表了 2009年07月27日 在 10:13 下午 | 永久链接

    看来码头受了不小的委屈,难为你了。其实你的影响力也不小啊,只是你发现了吗?

    看了这篇文章,有收获,虽然之前也测试过其它的数字,不过比较简单,没有做到全面。

    对于hack的问题,已经讨论过很多次,虽然结果并没能统一,不过少用hack还是对的。做为重构技术的范围之一,了解下hack也并没有什么不好。技术本身并无好坏之分,有分别的是使用它的人。

  17. 发表了 2009年07月29日 在 10:37 上午 | 永久链接

    不是势力,而是因为大公司的前端如果这么做,肯定有原因的。不可否认,你看到别人也这么写的时候,如果不是出身名门,你是不可能去研究它写的是否有思想,或者代表着什么。码头,你着相了。顺便转你的这篇文章。

  18. 发表了 2009年07月29日 在 9:19 下午 | 永久链接

    我对楼上基本无语!

  19. secss
    发表了 2009年08月13日 在 7:47 下午 | 永久链接

    看着你受委屈,好像我也很不高兴.可是你太喜欢骂人了!没有口德怎么混.还有你这个人太小气了!原因不解释

  20. 发表了 2009年08月13日 在 7:50 下午 | 永久链接

    骂人我承认,可是说我小气的人你还是第一个,谢谢!

  21. 发表了 2009年08月18日 在 7:10 下午 | 永久链接

    万恶的浏览器啊,为什么老是高些差异啊。当然我们就应该在差异中求生存,求发展。要不都下岗回家家。CSS hack个人认为,结构明晰的WEB页面只要用的CSS属性合理,遵循W3C CSS标准,CSS HACK是完全可以抛弃之…

  22. 风干的果子
    发表了 2009年08月19日 在 10:07 上午 | 永久链接

    严重支持,码头那段题外话说得太好了!

  23. 发表了 2009年08月20日 在 4:43 下午 | 永久链接

    有些事不能避免,就像hack的存在那样。

  24. 发表了 2010年01月10日 在 12:06 下午 | 永久链接

    我试了一下,Opera 10.5也支持。

  25. 发表了 2010年01月30日 在 10:11 上午 | 永久链接

    的写法支持ie8,但也支持3.0.1,如果修复了ie8,也可能会对Firefox3.0.1有影响。。

  26. time
    发表了 2010年03月6日 在 3:19 下午 | 永久链接

    码头,*color:#FFFF00; ie6和ie7都可以支持

  27. 一醉
    发表了 2010年04月22日 在 4:26 下午 | 永久链接

    #test { background-color:#F00; /* 所有浏览器都识别 */
    background-color:#0F0\9; /* 所有ie浏览器识别 */
    *background-color:#00F; /* IE6,IE7可以识别,ie8,FF浏览器不识别 */
    _background-color:#9C3; /* 仅ie6识别,其他浏览器不识别 */
    }
    这个写法我最终采用的~
    FUCK CSS HACK ,OH my god ~

  28. 一醉
    发表了 2010年06月9日 在 2:29 下午 | 永久链接

    最近测试发现 FF支持 background-color:#0F0;
    疯了~

  29. 一醉
    发表了 2010年06月9日 在 2:29 下午 | 永久链接

    background-color:#0F0;

  30. 一醉
    发表了 2010年06月9日 在 2:30 下午 | 永久链接

    靠 屏蔽了~

  31. 发表了 2010年07月21日 在 10:48 上午 | 永久链接

    我做IE的兼容会用 “+”和”_”
    现在基本不用 “*” 来做IE兼容了,原因仅仅是因为WCCC通不过。

  32. riant
    发表了 2010年08月19日 在 9:16 上午 | 永久链接

    如果只是为了通过标准而去较真,真的很无聊!

    个人觉得 * _ 的IE6,7 Hack 写法更方便,直观,所以一直使用。
    对于比较大的站点,就单独把 IE Hack 写到 fuck-ie.css 文件里边,然后通过if IE 来引入,w3C标准检测不到 if IE 里边的文件,于是也就心安理得的以为通过啦—– 鄙视我吧!

2 个引用通告

  1. EX4FUN » Blog Archive » 主流浏览器中的hacks 发表在 2010年01月10日 于 12:04 下午

    [...] 其中color:Red9这种形式IE家的浏览器6-8都支持,但是IE8却不支持“*”和“_”,所以如果要实现IE8的独立样式的话可以配合“*”和“_”一起使用。 WEB前端开发的码头兄列举了IE支持的“数字”,我试了一下,关于“”不只IE8支持,连Opera10.5也支持,所以大家用的时候也要注意一下Opera了。 January 10th, 2010 in CSS | tags: hacks, ie8 css hack [...]

  2. IE8 hack | 可乐加糖 发表在 2010年01月19日 于 8:51 上午

    [...] 原文地址:http://www.css88.com/archives/1681,次文章转载自愚人码头.感谢他们写出了这么好的文章.希望更多的WEB前端开发人员能够借鉴. [...]

发表评论

Your email is never shared. 标记为 * 的为必填项目

*
*

评论时,昵称或个人网站填的是商业网站的,一概标记为垃圾评论不予显示,并设置相关网站为过滤关键字,提交到google、百度垃圾网站数据库