<!--[if IE]><style></style><![endif]-->

标签：css hack   end   介绍   order   span   --   add   火狐浏览器   大于等于   

CSS hack就是为了让你的CSS代码兼容不同的浏览器,其中最难对付的就是IE浏览器的兼容性，因为它的版本很多，不过还好，微软发表声明已经不对IE8以下的版本进行维护了。但是我们也不能就认为不用学IE8之前版本的兼容性了。反过来，如果我想在IE浏览器中让元素表现出另外一种样式，我也可以通过CSS hack来实现，所以这招人烦的IE兼容性也可以为自己所用。总之，多学点没有坏处。

CSS hack通常分为 条件Hack、属性hack、选择符hack。下面一一来介绍：

1、条件hack：：

表现形式：

　　<!--[if  lte  IE 6]>

　　　　　　<style  type="text/css">

　　　　　　　　　　div{color:red;}

　　　　　　</style>

　　　　　<![endif]-->.

这是一个选择语句，只不过是在特定浏览器下执行。这个语句表明在IE6及6以下版本的IE浏览器中，div中字体的颜色是红色。其中lte表示 Less than or equal to（小于或等于）的简写。既然有小于等于那也可能会有greater or equal to大于等于（gte）,gt（大于）；lt（小于）；如果我想表示样式只对某个版本的IE浏览器才有效，这个语句又该怎么写呢？下面这个语句表明只有在IE8版本的IE浏览器下，div的背景颜色为#ccc;

<!--[if  IE 8]>

　　　　<style   type="text/css">

　　　　　　　　div{background:#ccc;}

　　　　　</style>

<![endif]-->

那如果我想表示除了某个版本IE浏览器，其余的浏览器都能表现这个样式又该怎么写呢？

<!--[if ! IE 8]>

　　<style  type="text/css">

　　　　　　div{box-sizing:content-box;}

　　<style>

<![endif]-->

表明除了IE8之外的所有IE浏览器中，div所占页面的实际尺寸的计算是content+padding*2+border*2；

2、属性hack：：

属性hack是指通过只有自己才能识别的出的符号添加在属性的前面，比如，

IE都能识别*  标准浏览器(例如火狐)不能识别*
IE6能识别*，但不能识别  !important
IE7能识别*，也能识别 !important
火狐不能识别*，但能识别!important

只有IE6能识别下划线“_”;

只有IE7能识别 *+

element{_color:#f7f7f7f;}只有IE6能识别，所以在IE6中字体颜色为#f7f7f7；

element{*color：#f7f7f7；}IE6和IE7都能识别；

element{color:red !important;}IE7和火狐浏览器能识别；

3、选择符hack

*+element{color:red;}只有IE7才能识别；

<!--[if IE]><style></style><![endif]-->

标签：css hack   end   介绍   order   span   --   add   火狐浏览器   大于等于   

原文地址：http://www.cnblogs.com/novice007/p/6910441.html