UI培训
美国上市UI培训机构

400-111-8989

热门课程

段老师分享 | CSS hack兼容总结

  • 时间:2016-01-11
  • 发布:UI培训
  • 来源:UI知识

人生就是一个不断反省不断进步的过程,常常总结自己做过的事,说过的话,就会让自己在总结中进步,工作和学习也一样。总结有利于及时找到自己的不足并改正,有利于对自己的计划进行规划,总结给了人努力工作的动力,培养了人思考的习惯,使工作更有效率,头脑更加清醒,目标更加明确,工作更有意义。日事日毕,日清日结。

今天达内ui培训小编为大家整理了段老师为大家带来的CSS hack兼容总结,希望对小伙伴们在今后网页设计中有所帮助。

针对各浏览器下Hack的写法:

1、 Firefox

@-moz-document url-prefix() {

.selector {

property: value;

}

}

2、 Webkit内核浏览器(chrome and safari)

@media screen and (-webkit-min-device-pixel-ratio:0) {

Selector { property: value; }

}

3、 Opera浏览器

@media all and (min-width:0) {

Selector {property: value;}

}

4、 IE9浏览器

:root Selector {property: value\9;}

5、 IE9以及IE9以下版本

Selector {property:value\9;}

6、 IE8浏览器

@media \0screen{

Selector {property: value;}

}

7、 IE8以及IE8以上的版本

Selector {property: value\0;}

8、 IE7浏览器

*+html Selector{property:value;}

*:first-child+html Selector {property:value;}

9、 IE7及IE7以下版本浏览器

Selector {*property: value;}

10、 IE6浏览器

Selector {_property/**/:/**/value;}

或者:

Selector {_property: value;}

或者:

*html Selector {property: value;}

结语

在Web页面制作中尽量不要使用CSS Hack来处理兼容问题。因为任何浏览器下出现渲染不一致都极有可能是我们自己的结构或样式不符合W3C的某些要求,或者说违背了浏览器的某些规则而造成的,所以我们应该尽量通过结构或CSS的修改来达到各浏览器渲染一致效果,除非到了万 不得已情况下,才考虑CSS的Hack。

上一篇:UED、UCD、UE、UI、交互设计这 5 个名词的概念有哪些区别?
下一篇:PS AI CDR文件格式互转方法大全(图)

交互设计与行为设计学

如何从零开始入门学习图标设计?

UI动效为什么走红?大概是这4个原因

【收藏】横扫电商设计中所有技巧

选择城市和中心
贵州省

广西省

海南省

台湾