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

本文提供了解决网页制作中不同浏览器(如FF、Opear等支持Web标准的浏览器与IE浏览器)对填充和边距显示不同效果的解决方法,通过CSS hack技术针对IE6、IE7等浏览器进行个性化设置,确保网页布局的一致性。
有时候我们在制作网页的时候,会遇到不同浏览器,对填充和边距显示的不同效果。导致心情纳闷
现在提供解决这个困扰的方法!

对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依次排列。

转载于:https://www.cnblogs.com/Sue_/articles/2489634.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值