ie6下常见的bug

我们布局页面,首先符合标准,如何写一个页面的标准性? 但是ie6等浏览器本身就比较特殊,bug比较多,兵法云,知己知彼百战百胜。我们需要了解ie6的一些常见bug,这样,更好的调试兼容性,下面小强老师就把一些常见的ie6bug列出来,大家去研究下。

考虑结构的稳定性
最常见的问题就是网页元素位置混乱,错位。

1.1.1.DOCTYPE 必须有

必需在开头处使用<!DOCTYPE>标记为所有的XHTML文档指定XHTML版本和类型,只有这样浏览器才能将该网页作为有效的XHTML文档,并按指定的文档类型进行解析。
<!DOCTYPE> 标记和浏览器的兼容性相关,删除<!DOCTYPE>,就是把如何展示HTML页面的权利交给浏览器,这 时,IE6,IE7,IE8,Firefox2,Firefox3,Chrome,有多少种浏览器,页面就有可能有多少中显示效果,这是不被允许的。

1.1.2margin加倍的问题

浮动  margin  但是可能会出现
出现这个问题一般要同时满足两个条件:

盒子要有浮动,在一个就是要要margin,符合这两个条件,一般在ie6下面会出现 双倍边距的问题。

解决方法:

_display:inline;

1.1.3   IE6图片底侧会有像素间隙问题

这个问题啊,再火狐浏览器,也可能出现哦!

1将img标记与/div标记放在同一行
<div><img src="data:images/jd.gif" /></div>
但是这样写不太方便阅读,我们知道代码的可读性是最为重要的。
所以建议用第二种方法
2.在CSS样式中给img上设置display:block;属性,将图片设为块元素下面代码。
    img{display:block;}
3.浮动

1.1.4   IE6下元素最小高度的问题

在IE6下面,如果想给把元素例如div设置成19像素左右以下的高度设置不了。这是因为IE6浏览器里面有个默认的高度
iE6下这个问题是因为默认的行高造成的,解决的技巧也有很多,例如:overflow:hidden  font-size:0;

1.1.5    ie6下面引起多余字符

两个浮动的盒子之间加html注释 会引起多余字符的问题。
 解决方法:
1. 删除注释
2.如果可以不给指定宽度
 
3. 在文字最后面多打一个空格


4.给这个盒子加定位。
.two{width:100px; float:left; position:relative;}

1.1.6  IE6下文字混排浮动3像素间距BUG

有时候,图片浮动后,文字环绕着有个3像素的距离。
解决方法:
_margin-right:-3px;

1.1.7  IE6下li里底部3像素间距BUG

如果li里面内容过于复杂,那么li和li之间就出现3像素白空隙。  很困扰哦

解决方法:

vertical-align: middle  bottom等

1.1.8  IE6中奇数宽高的BUG

我们尽量把盒子的高度和宽度设为偶数(定位的影响)

1.1.9了解ie6盒子会撑高的特性

内容有多大,盒子就撑多大
其他浏览器也像ie6这样:height:auto!important; 高度自适应
!important  为了提权  在所有里面它的权重最高。
ie7及其以上的ie版本  还有非ie浏览器都能识别。

转载于:https://www.cnblogs.com/xiaoqiang001/p/3861143.html

ie6下常见的bug 调整页面兼容性相关推荐

  1. CSS在IE6下的一些BUG和兼容性问题及解决办法

    兼容性一直是前端的一大问题,也是让前端工程师很头痛的事情,在浏览器中,各厂商都有一套属于自己的标准和方法,从某种程度上看,是否能很好的处理兼容性问题,体现着一个前端工程师的水平,下面看一下CSS在IE ...

  2. 解决在IE6下使用display: inline-block;的不兼容性问题

    网页中用到了如下CSS样式: .panel .item { height:25px; *height:24px; line-height:25px; text-decoration:none; mar ...

  3. [转]IE6下的CSS BUG枚举

    原文链接:http://luinlee.com/405/ie6csschinese/ 1.终极方法:条件注释.缺点是在IE浏览器下可能会增加额外的HTTP请求数. 代码 <!–[if lte I ...

  4. IE6下margin-left双倍bug问题

    熟悉 CSS 盒模型朋友相信对于 IE 双倍浮动边界 BUG 不会陌生,这个 BUG 只会产生在浮动行的第一个浮动元素(此处说法不准确,并不是第一个浮动元素,假如浮动的元素在一行显示不下,占用了多行, ...

  5. 黄聪:IE6下css大bug:文字神秘消失,鼠标选择了才出现

    解决办法:给文字所在的div或者容器加上 float:left; 属性

  6. ie6,ie7常见兼容性问题总结

    其实浏览器的不兼容,我们往往是各个浏览器对于一些标准的定义不一致导致的,因此,我们可以进行一些初始化,很多问题都很轻松解决. 下面是14条特殊情况仅供参考: 1. 文字本身的大小不兼容.同样是font ...

  7. Ie6 Ie7 常见 兼容问题解决方案

    下面是14条特殊情况你看一下是哪个问题出错了这些仅供参考: 1. 文字本身的大小不兼容.同样是font-size:14px的宋体文字,在不同浏览器下占的空间是不一样的,ie下实际占高16px,下留白3 ...

  8. E6终极备忘:修复IE6下_25+_Bugs

    E6终极备忘:修复IE6下_25+_Bugs 引言:"珍惜生命,远离IE 6!"       对IE6最好的策略就是不去兼容它. 好吧,我知道你的难处,你不得不去兼容IE6这个狗血 ...

  9. vue在微信里面的兼容问题_微信H5页面兼容性问题分析及解决方法

    随着H5页面越来越流行,越来越多的开发者都开始用最近H5做微信公众号,在这个过程中自然也会遇到不少的问题.小编在这里整理了五种常见的微信H5页面兼容性问题,来和大家分析一下问题的详情.出现原因以及相对 ...

最新文章

  1. ubuntu查看硬件信息
  2. PyTorch一年增长194%,兼容性更强,超越TensorFlow指日可待
  3. python到底可以做什么-Python到底可以做什么?
  4. python小程序-10个Python练手小程序,学习python的很好的资料
  5. 个人博客前端模板_博客设计——概述
  6. java paysign_微信支付签名算法java版本-其他地方都可通用
  7. spring_整体系统
  8. [云炬创业管理笔记]第二章测试1
  9. Bigtable数据模型和架构
  10. 很朴素的学习嵌入式系统的经验
  11. ubuntu中安装caffe docker 镜像【不用自己配环境,一键搞定,快速进入caffe学习】
  12. Tech.ED 2009特别奉献:Windows 7解读
  13. oracle-Ora-01779-内联视图更新法
  14. 如何成为数据分析师?小白这样做,快速入门数据分析
  15. html上外边距是,margin-top css设置对象上外边距间距(上外补白)
  16. 2022年度保密教育线上培训考试参考答案
  17. C++编程积累——解决cinnum输入问题,cin无效,无法从屏幕输入(cin状态清除)
  18. pkl转换json(pkl格式如何打开,pkl2json)
  19. hive币涨幅空间大吗_HIVE币今日价格_HIVE币最新消息_HIVE币行情走势图 - 币界网
  20. 汇众再观手游市场新风口-二次元游戏

热门文章

  1. react hooks使用_如何使用Hooks将React类组件转换为功能组件
  2. 初创企业购买企业邮箱_支持#NetNeutrality =支持设计师及其创建的初创企业
  3. graphql redux_如何在Redux应用程序中使用GraphQL
  4. Nmap安装和扫描(二:Nmap基本操作)
  5. 战地1如何修改服务器地址,《战地1》服务器加入方法一览
  6. 后端开发面试自我介绍_字节跳动暑期实习后端开发面试经历
  7. Python3 的urllib实例
  8. oracel 不为null 保存空字符串
  9. 使用Depth Texture
  10. .NET 使用 MySql.Data.dll 动态库操作MySql的帮助类--MySqlHelper