火狐与IE的差异

[color=red]JS中对于backgroundPosition:[/color]
IE6/7/8: 识别backgroundPositionX/Y,不识别backgroundPosition
FireFox/Opera: 识别backgroundPosition, 不识别backgroundPositionX/Y
Safari/Chrome: 识别backgroundPosition及backgroundPositionX/Y
注意:在火狐backgroundPosition="0px 12px"至少要在12后面加上一个px。否则火狐不识别!如果只是backgroundPosition="0 12"则无效。

[color=red]CSS中:[/color]
(1)设置float时,margin属性使IE会产生双倍距离。需要在引用margin的div设置display:inline;

#div{
float:left;
margin:10px 0 0 0;
display:inline;
}

(2)padding属性,使火狐的高宽变大,需要使用!important如:

#div{
padding: 7px 0 0 0;
height: 26px !important; /**火狐padding会增加高宽*/
height: 33px;//顺序好像是这样子的。可以尝试一下
}


(3) DIV浮动IE文本产生3象素的bug 左边对象浮动,右边采用外补丁的左边距来定位,右边对象内的文本会离左边有3px的间距.
 #box{ float:left; width:800px;}   #left{ float:left; width:50%;}   #right{ width:50%;}   *html #left{ margin-right:-3px; //这句是关键}    <div id="box">   <div id="left"></div>   <div id="right"></div>   </div> 

其实这样也可以(只是以后用字体的地方都要重设字体的大小):
*{font-size:0px}

对于Img,我的方法是 xxx img{border:0px;font-size:0px;},而且宽高大小最好比图片稍大些。
(4)对于字体有差异的(个人遇到的问题)

*{
padding:0px;
margin:0px;
text-align: center;
}
body{
margin: auto;
text-align: center;
font-size: 13px;
word-spacing: 100%;
font-family: 宋体;
}

(5) form表单的嵌套问题
当你布局合理的时候,还是在ie6乱了。而且你使用了form标签。
那么form要放在div之上。如

//这样比较好
<form>
<div></div>
</form>

//这样有时候是错的
<div>
<form></form>
</div>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值