兼容性问题

来源：互联网发布：淘宝返利链接怎么做编辑：程序博客网时间：2024/05/17 15:03

兼容性问题第一波：

IE6下最小高度为19px,增加font-size:0后可缩小为2px ；还是没解决嘛 Orz。。。(增加overflow：hidden属性，截掉多余的高度！)
IE6、IE7只支持<a>标签的四个伪类（lvha) ,不支持其他伪类。
IE6，7下父级有宽度就可以不用清浮动，（其他浏览器不可以哦~）
haslayout属性：在ie中，一个元素要么自己对自身的内容进行计算大小和组织，要么依赖于父元素来计算尺寸和组织内容。当一个元素的hasLayout属性值为true时，它负责对自己和可能的子孙元素进行尺寸计算和定位。启动haslayout的属性有：display：inline-block，width/heigth,zoom , position , float 等。
IE6 下子级元素的内容宽高如果大于父级元素宽高，会将父级宽高重新定义，以适应子级元素的排列。（其他浏览器则会挤出父级边框显示在边框之外。又是haslayout的锅。。。<(￣︶￣)↗[GO!]）其他浏览器可以用overflow属性，但IE6不支持。
IE6，7下元素浮动并在一行的元素都要加 float属性，否则两元素间会有3px空隙
IE6下的双边距的bug：块元素（block）有浮动（float） 和横向的margin，横向的margin值会被放大成两倍。（解决办法：display：inline-block）
IE6，7下 <li>下面3px间隙问题：<li>本身没有浮动，但是内容浮动了li下就会多出几个px。（解决：1.给li加浮动。2.加vertical-align属性。）
IE8及以下透明度属性使用：filter：alpha（opacity=0~100）；使用蒙版时，.float{position:absolute; left:0;top:0; width:100%; height:100%; background:#000; filter:alpha(opacity=50); 这样还不行，因为IE6下有最小宽度19px的问题，这层蒙版加在HTML和body之上，只会显示19px，所以要加 html，body{height：100% } 这条css命令。
ie6 下父级的overflow:hidden;是包不住子级的相对定位的；（父级也加上相对定位则可以解决）
在 IE6 下定位元素的父级宽高都为奇数那么在 IE6 下定位元素的 right 和 bottom 都有1像素的偏差。
IE6不兼容固定定位。
IE6下input背景随内容增多而滚动。（解决，加一个父类div，去掉input的原有border，background：whit属性。）

0 0