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

CSS Hack是什么?有什么用?怎么用?

上一篇:关于element 上传文件el-upload


下一篇:CSS快速入门基础篇,让你快速上手(附带代码案例)