前端兼容性问题总结

好东西就要给大家一起分享，我只是一个默默无闻的搬运工~

• 如何在IE6及更早的浏览器中定义小高度的容器？
  
  • IE6及更早的浏览器因为有默认行高，以至于无法定义小高度的容器
  • 解决方法示例：#test{overflow:hidden;height:1px;font-size:0;line-height:0}
• 如何解决IE6及更早的浏览器浮动时产生双边距的bug？
  
  • 在IE6及更早的浏览器中浮动后margin值解析为双倍，通过设置元素的display属性为inline即可解决
  • 解决方法示例：#test{_display:inline}//只有IE6识别
• 如何解决IE6及更早的浏览器中模拟min-height效果？
  
  • 解决方法1示例：#test{min-height:100px;_height:100px}，此时overflow不可设置为hidden，否则将失效
  • 解决方法2示例：#test{min-height:100px;_height:auto !important;height:100px;overflow:visible}，因为在IE6中定义一个高度，如果内容超过高度，元素会自动调整高度
• 如何解决IE7及更早的浏览器中随着value增多两边留白也增加的问题？
  
  • 解决方法示例：input,button{*overflow:visible}//IE6/IE7识别
• 如何解决IE7及更早的浏览器下当li中出现2个或以上的浮动时，li之间产生的空白间隙的bug？
  
  • 解决方法示例：#test{*vertical-align:top}，除了top值，还可以设置为text-top|middle|bottom|text-bottom，甚至特定的<length>和<percentage>值都可以
• -