css的hack技术使用汇总

什么是CSS hack？

在web开发中，我们经常会遇到各浏览器表现不一致的情况，由于不同厂商的流览器或某浏览器的不同版本，对CSS的支持、解析不一样，导致 在不同浏览器的环境中呈现出不一致的页面展现效果。这时，我们为了获得统一的页面效果，就需要针对不同的浏览器或不同版本写特定的CSS样式 ，我们把这个针对不同的浏览器/不同版本写相应的CSS code的过程，叫做CSS hack!  

下面就来谈一谈CSS hack 技术的使用：

CSS hack 技术

1. 详解css hack的分类和css hack三种方式

css hack 分类
有三种表现形式，css属性前缀法，选择器前缀法，以及IE条件注释法。

属性前缀法（即类内部hack）

选择器前缀法

IE条件注释法
css hack一般是将适用范围广，被识别能力强的css定义在前面。

2. 用CSS hack技术解决浏览器兼容性问题

　CSS Hack大致有3种表现形式：CSS属性Hack、CSS选择符Hack以及IE条件注释Hack， Hack主要针对IE浏览器。

　　a、属性级Hack：比如IE6能识别下划线"_"和星号" * "，IE7能识别星号" * "，但不能识别下划线 "_"，而firefox两个都不能认识。等等

　　b、选择符级Hack：比如IE6能识别*html .class{}，IE7能识别*+html .class{}或者*:first-child+html .class{}。等等

　　c、IE条件注释Hack：比如针对所有IE：，针对IE6及以下版本：，这类Hack不仅对CSS生效， 对写在判断语句里面的所有代码都会生效。

3. 不同浏览器的CSS hack写法介绍

区别IE6与FF： 
backgroundrange;*blue; < /span>
区别IE6与IE7： 
background:green !important;blue; < /span>
区别IE7与FF： 
backgroundrange; *background:green; 
区别FF，IE7，IE6：  
backgroundrange;*background:green !important;*blue; < /span>

4. 最全的CSS hack方式一览(兼容多浏览器)

一般情况下，我们尽量避免使用CSS hack，但是有些情况为了顾及用户体验实现向下兼容，不得已才使用hack。比如由于IE8及以下版本不支持 CSS3,而我们的项目页面使用了大量CSS3新属性在IE9/Firefox/Chrome下正常渲染，这种情况下如果不使用css3pie或htc或条件注释等方法时,可能 就得让IE8-的专属hack出马了。使用hack虽然对页面表现的一致性有好处，但过多的滥用会造成html文档混乱不堪，增加管理和维护的负担。

5. CSS hack

由于不同的浏览器，甚至同一浏览器的不同版本对CSS的解析认识不一样，导致生成的页面效果不一致，写出针对不同浏览器CSS code就称为 CSS hack。

常用的CSS hack 有三种方式，CSS 内部hack、选择器hack、HTML 头部引用，其中第一种最常用。

6. CSS Hack收集汇总

屏蔽IE浏览器（也就是IE下不显示） 
*:lang(zh) select {font:12px !important;} /*FF的专用*/ 
select:empty {font:12px !important;} /*safari可见*/ 
这里select是选择符，根据情况更换。第二句是MAC上safari浏览器独有的。 
仅 IE7识别 

相关问答

1. css hack的问题

2. 一个关于IE版本HACK的问题

3. input text文字选中改变默认颜色，safari不支持，有什么其他hack方案么

【相关推荐】

1. php中文网免费视频教程：《php.cn独孤九贱（2）－css视频教程》

Atas ialah kandungan terperinci css的hack技术使用汇总. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!