码迷,mamicode.com
首页 > 其他好文 > 详细

常见浏览器兼容性问题及解决方法(不断收集更新中)

时间:2015-04-27 15:03:28      阅读:182      评论:0      收藏:0      [点我收藏+]

标签:

问题一:不同浏览器的标签默认的margin和padding不同

解决方法: * { margin:0; padding:0;}

问题二:IE6双倍margin(块属性+float+横向margin)

说明:如div+css布局,<div style="float: left;margin-left: 10px;"></div>,在IE6下显示会有margin-left:20px的距离

解决方法:_display:inline

问题三:IE6下的浮动元素和非浮动元素间出现3像素

说明:当一个元素浮动时,同级别的文字没有浮动,在ie6下它们之间就会产生3个像素的bug。如:<div><img style="float: left;" src=""/>测试测试</div>,这时图片和文字就会出现3像素。

解决方法:css hack  如:<div><img style="float: left;" src=""/><span style="margin-right: 5px; _margin-right: 2px;">测试测试</span></div>

问题四:IE6标签有最小默认行高

说明:当设置较小高度的标签时(一般小于10px),标签高度超出自己设置的高度

解决方法:设置overflow:hidden;或者设置行高line-height 小于你设置的高度

问题五:IE6不支持min-height/max-height/min-width/max-width

解决方法:{min-height:200px; height:auto !important; height:200px; overflow:visible;}

问题六:图片默认有间距

说明:几个img标签放在一起布局的时候,有些浏览器会有默认的间距

解决方法:使用float属性为img布局

问题七:透明度的兼容

解决办法: filter:alpha(opacity=80);/*ie支持该属性*/

               opacity:0.8;/*支持css3的浏览器*/
 

常见浏览器兼容性问题及解决方法(不断收集更新中)

标签:

原文地址:http://www.cnblogs.com/cfxmj/p/4459964.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!