本文主要介绍CSS hack使用案例的详细讲解。本文通过一个简单的案例来说明对这项技术的理解和使用。以下是详细内容，有需要的朋友可以参考一下。
我以前对CSS hack抱着狭隘的偏见，觉得用标准方式写的代码不应该用这些“歪门邪道”。但是最近产品发布的一个小问题让我头疼了很久。最后查了资料，用CSS hack轻松解决了，我只好接受了。我不得不使用这些锋利的工具来处理神奇的IE。
什么是CSS hack
因为不同的浏览器，甚至同一款浏览器的不同版本，对CSS的理解不同，导致页面结果不一致。为不同的浏览器编写CSS代码称为CSS hack。
CSS hack常见的方式有三种：CSS内部hack、选择器hack和HTML头引用，其中第一种是最常用的。
CSS 内部hack
正经的CSS是这样写的。
！文档类型html
超文本标记语言
头
标题测试/标题
style type='text/css '。试验
{
背景色：绿色；
}
/风格
/头
身体
div class=' test ' style=' height:100px；宽度：100px行高：100px边距：50px'边框：1px solid # 000'/div
/body
超文本标记语言
这段代码适用于所有当前使用的浏览器，结果应该是这样的。
然而，一些这样的表达式在CSS3中很常见。
/*Mozilla内核浏览器：firefox3.5 */
-moz-transform:旋转|缩放|倾斜|平移；
/*Webkit内核浏览器：Safari和Chrome*/
-webkit-transform:旋转|缩放|倾斜|平移；
/*歌剧*/
-o-transform:旋转|缩放|倾斜|平移；
/*IE9*/
-ms-transform:旋转|缩放|倾斜|平移；
/*W3C标准*/
变换：旋转|缩放|倾斜|平移；
如果没有评论，乍一看你觉得是逆天。这样的代码管用！这种代码真的很管用。目前CSS3标准还没有统一，每个浏览器都有自己的表达方式，有些甚至实现了，有些没有。也是CSS内部黑客的基本原理，从上面很容易理解，但是真正的CSS黑客远不止这些，因为还有不朽的IE6和它的各种奇葩兄弟版本。
内部CSS hack语法如下：selector{hack？物业：valuehack？}，上面的代码显示了属性名之前的hack，当然还有这个
*背景颜色：绿色；
在属性前面加一个“*”只会在IE6和7上生效，其他版本的IE和现代浏览器都会忽略这个指令(除非特别说明，本文所有hack都是指声明了DOCTYPE的文档的效果)。
-背景色：绿色；
属性前面有一个“-”，只有IE6才识别，后面有一些hack。
背景色：绿色！重要；
添加“！”属性值之后！“重要”的写法只有IE6才能识别。其他版本的IE和现代浏览器都可以识别。还有“、“\0”、“9”等等。又乱又烦。画一张桌子。
这就清楚多了。如果只是想在IE访问时给上面的测试DIV加一个绿色背景，可以这样写。
背景色：绿色\ 9；
如果你想IE6红，IE7绿等黄(当然没人这么无聊)，可以这么写。
背景色：绿色；背景色：绿色；_背景色：绿色；
选择器hack
选择器hanck主要针对IE浏览器，但不常用。语法如下：hack selector{ sRules}
:根。试验
{
背景色：绿色；
}
HTML头部引用
HTML头引用比较特殊，类似于程序语句，只能在HTML文件中使用，不能在CSS文件中使用，只能在IE浏览器下执行。这段代码不仅仅是这个条件下的定义，而是视而不见，作为非IE浏览下的评论。
！默认情况下，首先调用css.css样式表
link rel=' style sheet ' type=' text/CSS ' href=' CSS . CSS ' rel=' external no follow '/
！[如果是IE 7]
！如果IE浏览器版本是7，调用ie7.css样式表
link rel=' style sheet ' type=' text/CSS ' href=' ie7 . CSS ' rel=' external no follow '/
！[endif]
！[如果lte IE 6]
！如果IE浏览器版本小于或等于6，调用ie.css样式表
link rel=' style sheet ' type=' text/CSS ' href=' ie . CSS ' rel=' external no follow '/
！[endif]
Lte:小于或等于的简称，意思是小于或等于。
Lt:是小于的简称，意思是小于。
Gte:是大于或等于的缩写，意思是大于或等于。
Gt:是大于的缩写，意思是大于。
！表示不相等，与javascript中的不等式判断相同。
书写顺序
你看，你看，这么多姿势，这么一个效果，这么多种写法。什么样的书写顺序才能保证所有浏览器都得到想要的效果？CSS只要是一级的，都有重复的属性设置，后面出现的会覆盖前面出现的，所以写的时候一般都是前面写的识别能力强的。我们举个例子。
_背景色：红色；
背景色：绿色；
如果我想让IE6上的DIV为红色，其他为绿色，可以写在上面吗？试着发现所有浏览器都是绿色的，因为IE6解析的时候，第一句可以识别，背景设置为红色，但是第二句所有浏览器都识别，IE6也不例外，背景颜色设置为绿色，只好反过来写了。
背景色：绿色；
_背景色：红色；
总结出来的规律是：先一般，后特殊。有兴趣的同学可以试试下面的CSS，看看效果是不是和你想的一样。
背景色：蓝色；/*所有浏览器*/
背景色：红色\ 9；/*所有ie*/
背景色：黄色\ 0；/* ie8 */
背景色：粉色；/* ie7*/
关于CSS hack使用案例的详细解释，本文到此结束。有关CSS hack用法的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。