CSS Hack实现浏览器样式兼容的兜底办法

CSS Hack是实现浏览器样式兼容的兜底办法,能不用就尽量不要使用。但是,针对一些浏览器的bug,比如老版本IE的bug,有时使用CSS Hack是不得已而为之的做法。本文将详细介绍CSS Hack。CSS Hack主要分为属性标记法和选择器前缀法两种

属性标记法
【IE6-】

对于IE6-浏览器主要使用下划线_和中划线-这两种字符

_color:blue;
-color:blue;

【IE7-】

对于IE7-浏览器可以使用非常多的字符,包括`~!@#$%^&*()=+{[]:<>,.?/

但是,比较常用的是加号+和星号*

+color:blue;
*color:blue;

【IE10-】

使用后缀\9可以识别出IE10-浏览器

color:blue\9;

【IE8+】

使用后缀\0可以识别出IE8+浏览器

color:blue\0;

【IE9、IE10】

使用后缀\9\0可以识别出IE9、10浏览器

color:blue\9\0;
 

选择器前缀法

【IE6-】

在选择器前面添加* html,可以识别IE6-浏览器

注意:*和html之间有无空格都可以生效


*html div{color:}

【IE7】

在选择器前面添加*+html,可以识别IE7浏览器

注意:*、+、html之间有无空格都可以生效

*+html div{color:}

【IE8】

在选择器外层使用@media \0,可以识别IE8浏览器

注意:@media和\0之间必须有空格

@media \0{
    div{color:}
}

【IE9+及其他非IE浏览器】

在选择器前面添加:root,可以识别IE9+及其他非IE浏览器

:root div{color:}

一个不是计算机专业的理科生,转行学前端

如果你也有一个编程梦,这是咱们的前端学习QQ群:784-783-012

(在线学习,8个月时间,目前就业,广州工作,月薪16k)

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容