每个浏览器不同的内核,不同的处理引擎,不同的渲染引擎就会导致写同一条样式的时候出现差异 这个现象叫做做兼容
浏览器:Ie(6 7 8 9 10 11) 谷歌 火狐 苹果
Ie6 7的常见的兼容性的问题
H5标签兼容。 (js文件引入)
第一块元素浮动,第二块元素加margin值等于第一块元素,在IE6下会有间隙问题; (第二块元素也float)
IE6下子元素超出父级宽高,会把父级的宽高撑开 (绕过)
p 包含块元素嵌套规则。 (绕过)
margin兼容性问题 合并 塌陷(传递) (float border overflow:hidden)
display:inline-block 的问题 (display:inline;zoom:1)
IE6 最小高度问题 (overflow:hidden)
IE6 双边距 (*display: inline;)
li里元素都浮动 li 在IE6 7 下方会产生4px间隙问题 (*vertical-align: top;)
IE6 7 父级元素的overflow:hidden 是包不住子级的relative (*position: relative; )
IE6下绝对定位元素父级宽高是奇数,绝对定位元素的right和bottom值会有1px的偏差 (设为偶数)
IE6 下input的空隙 (*float: left;)
IE6 下 输入类型表单控件背景问题 (background-attachment: fixed;)
IE6不支持背景透明的问题 <script src="js/DD_belatedPNG_0.0.8a.js"></script> <script> DD_belatedPNG.fix("i"); </script> 引人一个js文件包