CSS 在IE8.0和FF中的区别

这两天在想这个问题,在论坛里发的帖子,也没有人回,网上的那些答案基本上都是在IE8.0以下的版本,通过IE8.0和FF3.63版本的比较,感觉现在两者的相差不是太大,我只发现有下面一些有明显的区别.刚看了论坛里的信息,还有一种方法:下载CSS3.0手册看看,里面有各个浏览器的说明,是否兼容

第一:cursor:hand值。 IE中可以显示手型,但是在FF中样式不作用

第二:IEFF的透明设置不同

                    IE                                                                     FF      

比如:  filter:alpha(opacity=10);                    opacity:.10;                                                             

第三:ulFF中默认是有padding值的, 而在IE中只有margin默认有值 ,如果设置padding:0;

Margin:0 可以解决大多数问题,但是要说慎用,要和项目组人员讨论一下.在不设置marginpadding情况下

特别是外边距的差别很大

                    IE                                                                     FF      

IE8.0下图片                          FF浏览器

第四:FireFox下连续长字段自动换行。比较的结果是,FF的背景显示会屏蔽上一行的外观效果

                    IE                                                                     FF      

IE8.0下图片                      FF浏览器

可以通过下面的代码,在浏览器中看到最终的效果。还有一些区别,我自己现在还没有搞搞清楚(组合属性的差别),希望大家在实际工作中遇到别的差异的地方,也能够记录下来,来共同完善这个差别表

以下是测试的代码

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

<

 

 

html

>

<

 

 

head

>

<

 

 

title

>

</

 

 

title

>

<

 

 

style type ="text/css"

>

div

{

 

 

/*margin-left:auto ;

margin-right:auto ;*/

 

 

background-color : Red

;

 

 

cursor : help ;

/*FirefoxIE*/

 

 

/*float:left ;*/

 

 

display : inline ;

/*FirefoxIE*/

 

 

padding-top : 10px

;

 

 

height : 10px

;

 

 

letter-spacing : 1px ;

/**/

 

 

word-spacing : 1px ;

/**/

 

 

text-transform : uppercase

;

 

 

text-decoration : underline

;

 

 

width : 20px

;

 

 

border-width : 10px

;

 

 

filter : alpha(opacity=10) ;

/*IEFF*/

 

 

opacity : .10

;

}

</

 

 

style

>

<

 

 

script type

="text/javascript">

 

 

function

load() {

alert(document.getElementById(

 

"div2"

).clientWidth);

alert(document.getElementById(

 

"div2"

).offsetWidth);

}

</

 

 

script

>

</

 

 

head

>

<

 

 

body

>

a

<

 

 

div

>

hello world hello world hello world hello world hello world hello world hello world hello world hello world hello world hello world hello world

</

 

 

div

>

<

 

 

div id

="div2">

hello world

</

 

 

div

>

<

 

 

p ></ p

>

<

 

 

a href ="#"> hello </ a

>

</

 

 

body

>

</

 

 

html

>

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值