常见浏览器兼容性问题

Posted 2020-08-22 星星眨眼

1.不同浏览器的标签默认的外补丁和内补丁不同

问题：不同浏览器的margin 和padding差异较大。

解决：CSS里    *{margin:0;padding:0;}

2.IE6的双边距bug

 问题:浮动时，左右边距可能为所写值的2倍

解决：在float的标签样式控制中加入 display:inline;

3.高度小于10px是，在IE6，IE7中高度可能超出自己设置高度

问题：IE6、7超出自己设置的高度

解决：给超出高度的标签设置overflow:hidden

4.图片默认有间距

问题：几个img标签放在一起的时候，有些浏览器会有默认的间距

解决：使用float属性为img布局

5.标签最低高度设置min-height不兼容

问题：因为min-height本身就是一个不兼容的CSS属性，所以设置min-height时不能很好的被各个浏览器兼容

解决：如果我们要设置一个标签的最小高度200px，需要进行的设置为：{min-height:200px; height:auto !important; height:200px; overflow:visible;}