CSS Hack是什么?有什么用?怎么用?
css Hack
作用
好处:使用CSS Hack可以控制不同的浏览器及版本之间的显示差异,某些情况下处理兼容问题可以事半功倍
坏处:滥用会影响页面性能,也会导致后期维护困难,因此尽可能减少对CSS Hack的使用。
开发者必须慎用CSS Hack,能不用就不用。
分类
1、条件Hack
用于选择IE浏览器及IE的不同版本
if条件Hack是HTML级别的(包含但不仅是CSS的Hack,可以选择任何HTML代码块)
if条件共包含6种选择方式:是否、大于、大于或等于、小于、小于或等于、非指定版本
大于:选择大于指定版本的IE版本。关键字:gt(greater than)
大于或等于:选择大于或等于指定版本的IE版本。关键字:gte(greater than or equal)
小于:选择小于指定版本的IE版本。关键字:lt(less than)
小于或等于:选择小于或等于指定版本的IE版本。关键字:lte(less than or equal)
非指定版本:选择除指定版本外的所有IE版本。关键字:!
代码示例:
/*只在IE中可见*/
<!--[if IE]>
<p>只在IE中能看到这个段落</p>
<![endif]-->
/*只有IE6以上,才能看到应用了test类的元素是红色文本*/
<!--[if gt IE 6]>
<style>
.test{color:red;}
</style>
<![endif]-->
2、属性级Hack
_下划线:选择IE6及以下
*:选择IE7及以下
\9:选择IE6+
\0:选择IE8+和Opera15以下的浏览器
3、选择级Hack
*html IE6+
*html #test{ background: green; }
*+html IE7