Pixel Perfect - Hack

比较常用的是只对IE进行hack,常见的写法有以下几种:

1. IE条件注释

<!-- [ if IE]>  
<link href="ie.css" rel="stylesheet" type="text/css" />  
<![endif]-->  

还可只对某一IE版本或以下版本hack

2. html/body标签中写class hook

比如使用jQuery Browser Plugin后通过firefox浏览页面html被附加上这样的class

<html class="win firefox firefox3 gecko gecko1">  

之后针对不同的浏览器(及版本)写hack

Google的某些产品使用的是此方法,比如Google Reader,只不过hook的对象为body标签而非html标签,详见http://www.99css.com/19

通过前后台生成hook皆可

CSS Hack

比如:

div{  
    color: black; /* all browsers */
    color: red9; /* IE8 and below */
    #color: green; /* IE7 and below */
    .color: yellow; /* IE7 */
    _color: blue; /* IE6 and below */
}

在实际项目中使用较多的是此方法,原因详见 http://www.99css.com/65#hack。当然,也可以第一种和第三种方法配合,方便通过验证

后记

如果不是为了pixel perfect,平时也用不到太多hack,hack多了非常令人恶心(think, there was an old lady who swallowed a fly)。

这是pixel perfect系列的最后一篇,面对“不可能完成的任务”,至少我们努力过了…

——————– 2010-3-22 补充 ——————–

最近在15+ Techniques And Tools For Cross Browser CSS Coding看到针对IE7 hack的.写法,补充一下:)