zoukankan      html  css  js  c++  java
  • css文字重复ie bug导致文字的奇怪复制

    当多个浮动的元素彼此跟随,中间加注释的时候,最后一个浮动元素内的文本偶尔会复制到最下面去。学名Duplicate Characters Bug

    程序代码
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="//www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>多了一只猪</title>
    </head>
    <body>
    <div style="400px">
    <div style="float:left"></div>
    <!-- -->
    <div style="float:right;400px">↓这就是多出来的那只猪</div>
    </div>
    </body>
    </html>


    可以通过以下的办法来解决:
       1、不放置注释。最简单、最快捷的解决方法
       2、注释不要放置于2个浮动的区块之间。
       3、将文字区块包含在新的<div></div>之间,如:<div style="float:right;400px"><div>↓这就是多出来的那只猪</div></div>。
       4、去除文字区块的固定宽度,与3有相似之处。
       5、有的人在猪后加一个<br />或者空格,但只是消除现象。
       6、不要给浮动元素设置多宽度,使其不会到达包含元素的底部,或者对最后一个元素设置margin-right: -3px;或者更小。
       7、注释可以这样写:<!--[if !IE]>Put your commentary in here...<![endif]-->

  • 相关阅读:
    C++中的 . 和 >
    JVM内存学习
    JAVA内部类
    2013年3月25日
    Dalvik虚拟机
    多线程访问数据库
    深入学习Android笔记(一)
    结对项目四则运算 “软件”之升级版
    分布式版本控制系统Git的安装与使用
    第一次作业准备
  • 原文地址:https://www.cnblogs.com/wangpei/p/1400275.html
Copyright © 2011-2022 走看看