- 浏览: 26442 次
- 性别:
- 来自: 北京
-
文章分类
最新评论
在IE6中,会无缘无故多出几个字儿来,这是IE6BUG 。
下面把自己做后的总结整理下:
方案1:
原因:出现这种情况绝大多数都是与浮动有关系的。 [通常都是用这个方案解决的]
解决思路: 检查下出现这种情况的容器(比如DIV)是否有用到浮动,并且,当前浮动是否有必要应用;如果即使不用浮动也可以达到效果话,就将浮动去除。或是,加一个 "Clear:both" 清除浮动。(像绝对定位以及浮动这些属性,一般是能不用就不用,至于为啥俺说不出来,我是完全凭感觉做事的,事实证明我这么做是正确的 )
方案2:
原因:检查代码中是否有添加注释。
解决思路: 如果代码中包含了注释,可以尝试下将注释删除后是否会正常显示。 ( 因为曾经有次我有遇到过这么个情况,所以导致我一直到现在都不敢再在代码里写注释)另一个好玩的就是,如果这个Bug真是因为注释语句引起的话,那么,每添加一条注释语句,界面中就会多出一个溢出文字。也就得到了一个公式: 溢出文字 = 注释条数 X 2 -1 (不管文字是否为中英文), 当溢出的字数大于总字数时,文字区块就会消失。今天在百度中发现了另一种写注释的方法,可以达到既能写注释,又会必免再次出现这种情况的两全的办法: 可以用IE注释,语法是: <!-- [if !IE]> 注释语句 <![end if] -->;第二种解决办法是: 将注释语句写在Div容器里边;
方案3:
原因: 如果代码是在form表单中的,检查表单里是否包含Hidden标签。
解决思路: 如果表单中包含hidden标签,需要在hiddent标签外加对<div></div>来把它包住。(具体原因不是很了解,只知hidden标签不能直接在form里显示,如果实在解决不了这个IE6 Bug时,不妨套用下试试)
方案4:
原因:用Div将文字一层一层包住。
解决思路: 当把文字区域用DIV一层一层包住时,会惊奇滴发现:多余的文字也在一个一个减少。但是这种做法超级笨,典型的治标不治本。 不建议使用。
方案5:
原因:在文字区域后加入' < br / >' 或 空格符。
解决思路: 通过在文字区域后加入换行符与空格符也会解决不显示多余文字的问题,不过同样的,这个解决方案并不能根本的解决问题,因为它溢出的不是文字而是换行符或空格符,所以只要界面排版没有影响 就看不太出来。
方案6:
原因:给文字区域加入 ' Prostion : relative'属性。
解决思路: 通过给容器设置Prostion 也会解决这个IEBug。
方案7:
原因: 浮动文字区域的容器有设置固定宽度。
解决思路: 将固定宽度去除,会很好的解决这个IE Bug。
方案8: 原因:IE6 3px Bug。 解决思路: 将容器固定宽度-3px; 或设置margin-right:-3px; 同样会解决这个Bug。(需要注意的是,更改宽度后是否会影响到排版)
来源:http://hi.baidu.com/lhcling/item/d96b1245817e67e3bdf451b2
http://bbs.blueidea.com/thread-2692486-1-1.html
下面把自己做后的总结整理下:
方案1:
原因:出现这种情况绝大多数都是与浮动有关系的。 [通常都是用这个方案解决的]
解决思路: 检查下出现这种情况的容器(比如DIV)是否有用到浮动,并且,当前浮动是否有必要应用;如果即使不用浮动也可以达到效果话,就将浮动去除。或是,加一个 "Clear:both" 清除浮动。(像绝对定位以及浮动这些属性,一般是能不用就不用,至于为啥俺说不出来,我是完全凭感觉做事的,事实证明我这么做是正确的 )
方案2:
原因:检查代码中是否有添加注释。
解决思路: 如果代码中包含了注释,可以尝试下将注释删除后是否会正常显示。 ( 因为曾经有次我有遇到过这么个情况,所以导致我一直到现在都不敢再在代码里写注释)另一个好玩的就是,如果这个Bug真是因为注释语句引起的话,那么,每添加一条注释语句,界面中就会多出一个溢出文字。也就得到了一个公式: 溢出文字 = 注释条数 X 2 -1 (不管文字是否为中英文), 当溢出的字数大于总字数时,文字区块就会消失。今天在百度中发现了另一种写注释的方法,可以达到既能写注释,又会必免再次出现这种情况的两全的办法: 可以用IE注释,语法是: <!-- [if !IE]> 注释语句 <![end if] -->;第二种解决办法是: 将注释语句写在Div容器里边;
方案3:
原因: 如果代码是在form表单中的,检查表单里是否包含Hidden标签。
解决思路: 如果表单中包含hidden标签,需要在hiddent标签外加对<div></div>来把它包住。(具体原因不是很了解,只知hidden标签不能直接在form里显示,如果实在解决不了这个IE6 Bug时,不妨套用下试试)
方案4:
原因:用Div将文字一层一层包住。
解决思路: 当把文字区域用DIV一层一层包住时,会惊奇滴发现:多余的文字也在一个一个减少。但是这种做法超级笨,典型的治标不治本。 不建议使用。
方案5:
原因:在文字区域后加入' < br / >' 或 空格符。
解决思路: 通过在文字区域后加入换行符与空格符也会解决不显示多余文字的问题,不过同样的,这个解决方案并不能根本的解决问题,因为它溢出的不是文字而是换行符或空格符,所以只要界面排版没有影响 就看不太出来。
方案6:
原因:给文字区域加入 ' Prostion : relative'属性。
解决思路: 通过给容器设置Prostion 也会解决这个IEBug。
方案7:
原因: 浮动文字区域的容器有设置固定宽度。
解决思路: 将固定宽度去除,会很好的解决这个IE Bug。
方案8: 原因:IE6 3px Bug。 解决思路: 将容器固定宽度-3px; 或设置margin-right:-3px; 同样会解决这个Bug。(需要注意的是,更改宽度后是否会影响到排版)
来源:http://hi.baidu.com/lhcling/item/d96b1245817e67e3bdf451b2
http://bbs.blueidea.com/thread-2692486-1-1.html
发表评论
-
获取当前鼠标点击的位置
2015-05-13 14:39 0<img src="images/a.gi ... -
判断checkbox是否选中
2015-05-12 11:22 645$('#checker').click(function( ... -
ie67中li下的间隙问题
2014-03-21 17:42 558一、以下是引发此BUG的条件: 必要条件: l ... -
含滚动条的内容区域,文字居中问题 版心问题
2014-01-23 14:53 0最近在工作中遇到了一些版心问题,下面简单的记录一下。 ht ... -
遇到的问题
2013-10-21 17:45 0影视课堂: 1、影视课堂--影视课堂 当含有滚动条的一个块 ... -
点击空白处下拉列表隐藏,全选,反选,不选
2013-08-13 09:44 732<!DOCTYPE html PUBLIC &quo ... -
美化单个checkbox
2013-08-02 10:37 501<script language="jav ... -
美化type="file"
2013-08-02 10:30 543<div class="fileInput ... -
ie6兼容png前置与背景
2013-07-23 11:16 714次方法需要用到一个插件:DD_belatedPNG.js ... -
美化select
2013-07-29 13:46 556需要用到一个selectbox.js插件,在这里直接粘贴到代码 ... -
下载--美化select 2
2013-07-29 13:46 578<!DOCTYPE html PUBLIC &quo ... -
下载--美化select
2013-07-29 13:47 486<!DOCTYPE html PUBLIC &quo ... -
视频播放 ---滚动条的设置
2013-07-29 13:52 861此方法需要引入一个插件:jscroll.js. 以 ... -
CSS 子div设置float之后父div无法自适应高度问题 --清除浮动
2013-04-18 17:31 0向父容器的末尾再插入一个额外的标签,并令其清除浮动(clear ... -
同一行图片和文字垂直居中以及图片和文字间隙问题
2013-04-04 23:47 14801、垂直居中: 如果一个div中含有图片和文字,并且 ... -
透明度相关问题
2013-04-04 04:48 0背景渐变问题: http://hi.baidu.com/dii ... -
ie6兼容-------Xun
2013-07-23 10:33 6231、float属性对margin的影响-----双边距问题 ...
相关推荐
在IE6浏览器中,开发者经常会遇到一些非预期的布局问题,其中之一便是“文字溢出”和“浮动错位”的现象。这两个问题有时并非由代码逻辑或CSS规则导致,而是由于HTML注释的不当使用所引起的。本文将深入探讨这两种...
例如,如果一个链接(`<a>`)需要隐藏文字,转换其为块级元素(`display:block`)可能会导致布局问题,因为后面的元素会被挤到下一行。为解决这个问题,可能需要使用浮动(`float`)或其他布局技术。 2. **使用`...
在CSS(层叠样式表)中,我们有时需要对超出容器宽度的文字进行截断,以保持页面布局的整洁。本文将详细介绍三种常见的CSS方法来截取字符并隐藏溢出的文本。 1. **使用`overflow`和`text-overflow`属性** 当你希望...
6. align-content:当伸缩容器的侧轴有多余空间时,此属性用于对齐伸缩行,拥有多个可选值,包括flex-start、flex-end、center、space-between、space-around和stretch。 通过以上属性,开发者可以灵活地控制伸缩...
这样的设置可以让过长的文本在容器内只显示一部分,并以省略号表示被隐藏的部分。 总的来说,`word-wrap`、`word-break`和`white-space`这三大CSS属性为我们提供了丰富的文本换行和裁剪控制手段,可以根据具体需求...
但需要注意,这种方式只适用于IE6,对于其他现代浏览器则应该继续使用min-height属性。 在文章的实例中,通过设置一个类名为“test”的div元素的min-height为80px,我们可以看到两个相同类的div元素在内容足够的...
在Web前端开发中,有时我们需要对长文本进行限制,使其在特定区域内只显示两行,并在超出时使用省略号来表示剩余内容。这通常用于摘要显示、列表展示或者优化移动设备上的用户体验。本篇文章将详细讲解如何实现这一...
这些布局调整通常只需要一行CSS代码即可完成,而使用传统技术则往往需要更多的CSS规则和复杂的HTML结构。 Flexbox还支持将flex-direction和flex-wrap属性合并为一个flex-flow简写属性,这样可以更简洁地在单个声明...
9.完善了CSS样式表,布局更加整洁美观大方,现在可以完美支持IE6、7、8、FireFox等浏览器。 10.FLASH幻灯可以跨域调用远程图片地址,修正了FLASH幻灯不支持远程图片地址的BUG 11.后台支持多用户管理,现在可以根据...