建站学 - 轻松建站从此开始!

建站学-个人建站指南,网页制作,网站设计,网站制作教程

当前位置: 建站学 > 网页设计 > css教程 >

初学CSS要注意IE6注释bug

时间:2011-04-16 16:06来源: 作者: 点击:
初学CSS的朋友可能会碰到这样的问题,用IE6预览页面时经常在div区域外看到div区域内的文本内容,好像文本又被复制了一遍一样。这个其实是IE6的一个bug,本文就是要解决这个问题。如下图:   bug名称:     这个问题是IE6的bug,俗称IE6注释bug,

初学CSS的朋友可能会碰到这样的问题,用IE6预览页面时经常在div区域外看到div区域内的文本内容,好像文本又被复制了一遍一样。这个其实是IE6的一个bug,本文就是要解决这个问题。如下图:

  

bug名称:
    这个问题是IE6的bug,俗称IE6注释bug,也叫做浮动容器的字符复制bug。

形成原因:
    它的形成原因是几个相连的浮动容器中间插入一段html注释代码,就会将最后一个容器中的最后几个字符复制到容器之外显示出来,不过这个bug只存在于IE6中,IE7及以上版本和Firefox等浏览器不存在此bug。

    下面以一段代码举例:

以下是代码片段:

<style type="text/css"> 

div { 

 width:100%;  float:left; 

</style> 

<div>段落文字</div> 

<div>段落文字</div> 

<div>段落文字</div>

<!--引出bug的黑手--> 

<div>段落文字</div> 

<div>段落文字</div>    

将这段代码复制到网页中,然后用IE6预览,在第五行文字的下边就会多出来一个文字,如图一中所示,而用其它浏览器的预览效果则如图二所示。

解决方法:
    其实这个bug的解决方法十分简单,那就是——去掉注释,或者将注释添加到最后一个元素

(责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片