css hack基础理解

来源:互联网 发布:记忆最佳时间段在 知乎 编辑:程序博客网 时间:2024/05/17 16:54

为什么需要css hack:

因为不同厂商的浏览器以及不同的版本对于css的支持和解析结果有不同的差异,并且css的优先级问题都会导致生成的页面效果产生变化,得不到我们想要的效果,css hack的作用就是为了使css代码能够兼容不同的浏览器以及版本,但同时我们也可以利用它来为不同的浏览器定制不同的效果;


使用方法:CSS Hack大致有3种表现形式,CSS类内部Hack、选择器Hack以及HTML头部引用(if IE)Hack,CSS Hack主要针对类内部Hack:

1.HTML头部引用(if IE)Hack:针对IE,这类Hack不仅对CSS生效,对写在判断语句里面的所有代码都会生效。这个方法主要用于IE以及非IE的区别以及不同版本IE:

<!--[if IE]>   只在IE下生效<!--[if !IE]>非IE浏览器生效<!--[if IE 6]>只在IE6下生效

2.CSS类内部Hack:这个方法同过不同的特殊标记进行hack:具体使用是在CSS样式属性名前加上一些只有特定浏览器才能识别的hack前缀:


PS:在标准模式中:“-″减号是IE6专有的hack;“\9″ IE6/IE7/IE8/IE9/IE10都生效;“\0″ IE8/IE9/IE10都生效,是IE8/9/10的hack;“\9\0″ 只对IE9/IE10生效,是IE9/10的hack。


3.选择器Hack:选择器前缀法是针对一些页面表现不一致或者需要特殊对待的浏览器,在CSS选择器前加上一些只有某些特定浏览器才能识别的前缀进行hack。由于使用过于麻烦,所以这里只列举最简单的两个例子:

①.*html *前缀只对IE6生效   ②.*+html *+前缀只对IE7生效


其实 css hack并不实际运用并不多,而且使用起来过于复杂,素以此篇只是简单地做了一个初步的了解。Hack有风险,使用需谨慎!!!

2 0