您现在的位置: 365建站网 > 365学习 > CSS在IE6/IE7/IE8/Firefox兼容问题

CSS在IE6/IE7/IE8/Firefox兼容问题

文章来源:365jz.com     点击数:339    更新时间:2011-03-15 22:21   参与评论

1.符号*的使用。

IE6,IE7都可以识别*,但IE8和Firefox都识别不了。看以下样式

# wintop
{
background: url(body
-top.gif) top repeat-x;
margin
-top:10px;
*margin-top:0px;
}

在IE6和IE7中解释为离上边距为0个像素,因为它可以识别*,因而*margin-top:0px覆盖了上面的10px。而在IE8和Firefox中,由于它不能识别*,所以仍然解释为离上边距10个像素。

2.* HTML针对IE6

.content
{
background
-color: Gray;
width: 200px;
height: 200px;
left: 0px;
top: 0px;
}
* html .content
{
/* IE6 */
margin
-top: 100px;
}

margin-top的100个像素只对IE6起作用。

3.!important对IE6来说不识别,因此我们也可以用它来对IE6和IE7/IE8/FF区别做处理。

.content
{
background
-color: Gray;
width: 200px;
height: 200px;
left: 0px;
top: 0px;
margin
-left:0px !important;
margin
-left:100px;
}

注意:在IE7,IE8和Firefox中优先解释带!important的元素,所以下面的margin-left:100px不会覆盖上面的margin-left:0px !important。

但对IE6来说,它只能识别margin-left:100px。

4.*和!important组合使用,看下面例子:

background-color:#FF0000 !important;
*background-color:#00FF00 !important;
*background-color:#0000FF;
background
-color:#000000;

在FF和IE8中,第一行起作用

在IE7中,第二行起作用

在IE6中,第四行起作用

如对本文有疑问,请提交到交流论坛,广大热心网友会为你解答!! 点击进入论坛


发表评论 (339人查看0条评论)
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码: 点击我更换图片
最新评论
------分隔线----------------------------