不同浏览器Firefox、IE6、IE7、IE8、IE9定义不同

2018-12-10  本文已影响0人  枫叶飘雪

不同浏览器Firefox、IE6、IE7、IE8、IE9定义不同CSS样式

有时候我们在制作网页的时候,会遇到不同浏览器,对填充和边距显示的不同效果。导致心情纳闷

现在提供解决这个困扰的方法!

对FF、Opear等支持Web标准的浏览器与比较顽固的IE浏览器进行针对性的CSS hack

/*FF、Opear等支持Web标准的浏览器*/

#header {

margin-top: 23px;

margin-bottom: 23px;

}

/*IE6浏览器*/

*html #header {

margin-top: 13px;

margin-bottom: 13px;

}

/*IE7浏览器*/

*+html #header {

margin-top: 18px;

margin-bottom: 18px;

}

因此,当你在遇到这种情况的时候可以用

* html   来定义IE6

*+html   来定义IE7

更新:

还有一种css hack直接与其他浏览器一起写在一条css表达式中

#header{

margin-top: 13px;/* 所有浏览器都支持 */

margin-top: 13px !important;/* Firefox、IE7支持 */

_margin-top: 13px;/* IE6支持 */

*margin-top: 13px;/* IE6、IE7支持 */

+margin-top: 13px;/* IE7支持 */

margin-top: 13px\9;/* IE6、IE7、IE8、IE9支持 */

margin-top: 13px\0;/* IE8、IE9支持 */

}

需要注意书写顺序:所有浏览器、Firefox、IE8、IE7、IE6依次排列。

上一篇 下一篇

猜你喜欢

热点阅读