CSS Hack
第一种：IE条件式
因为IE对CSS的解析存在很多的问题，所有我们的CSS hack 大部分都是针对IE的。还有就是官方也有自己的CSS hack，那么看代码吧！
<!--[if IE]>
<link type="text\css" href="IE.css" rel="stylesheet"/>
<![endif]-->
这样就可以为IE加载定义好的CSS文件了。
我们还可以为不同的IE版本加载不同的CSS文件，例如：
<!--[if IE 6]>
<link type="text\css" href="IE6.css" rel="stylesheet"/>
<![endif]-->
如果我们想按照一定范围版本的IE进行hack，我们可以结合一些关键字来搞定。
lte 小于等于
lt 小于
gte 大于等于
gt 大于
! 表示不等于
具体的例子就不弄了，大同小异，有兴趣的可以试试。
这种方式的不仅对加载link标签有作用，而且对js、style等也是有作用的。
第二种：选择前缀式
这种方式还是挺常见的，就是在css 选择符前加一些只有特定的浏览器才能识别的前缀，例如 *html 只对IE6有效、*+html只对IE7有效。当然这种方式看似挺不错的，但是保不齐那天微软在后面的浏览器也识别了，那就有点惨了，所以还是第一种方式比较保险。
ps：*+html 对IE7的HACK 必须保证HTML顶部有如下声明：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
第三种：样式属性前缀式
这种方式的hack更常见，就是在样式属性下面加前缀，这样这些属性只有在特定的浏览器上才有效。例如 _ 只在 IE6 生效、* 只在IE6和IE7下生效。
区别IE6与FF：
background:orange;*background:blue;
区别IE6与IE7：
background:green !important;background:blue;
区别IE7与FF：
background:orange; *background:green;
区别FF，IE7，IE6：
background:orange;*background:green !important;*background:blue;
ps：IE都能识别*;标准浏览器(如FF)不能识别*；
IE6能识别*，但不能识别 !important,
IE7能识别*，也能识别!important;
FF不能识别*，但能识别!important;
在理论上来说条件选择的那个方式最好用，但是那个东西不利于开发和维护，所以后面那两种比较流行，当然也都存在一定的向后兼容风险，这个要看具体情况了。
原文链接：http://www.cnblogs.com/iloveiknow/archive/2011/11/22/2259040.html
-------------------------------------------------------------
在这个浏览器百花争鸣的时代，作为前端开发的我们为了我们漂亮的设计能适应各个浏览器可为煞费苦心，主要体现在javascript和css上面。javascript我这次就不谈了，先说说css。
<html>
<head>
<title>Css Hack</title>
<style>
#test
{
width:300px;
height:300px;
background-color:blue; /*firefox*/
background-color:red\9; /*all ie*/
background-color:yellow\0; /*ie8*/
+background-color:pink; /*ie7*/
_background-color:orange; /*ie6*/
}
:root #test { background-color:purple\9; } /*ie9*/
@media all and (min-width:0px){ #test {background-color:black\0;} } /*opera*/
@media screen and (-webkit-min-device-pixel-ratio:0){ #test {background-color:gray;} } /*chrome and safari*/
</style>
</head>
<body>
<div id="test">test</div>
</body>
</html>
上面这段代码大家可以直接copy出来，保存成html在各浏览器试试。下面我来分析下：
posted on 2012-07-18 17:23 dragonstreak_1 阅读(199) 评论(0) 编辑 收藏 举报
