你还在为浏览器兼容性问题苦恼吗

一、图片下方有间隙，解决方法如下

a)     将图片变为块元素

b)    将父元素的字体大小设置为0

二、图片间有间隙，解决方法如下

a)     将代码写在同一行

b)    将父元素字体大小设置为0

c)     使图片浮动

三、图片加超链接后，IE浏览器下方有边框，解决方法

a)     给图片设置border：none

四、给图片加超链接后，如果要设置鼠标移过显示边框效果，默认情况下，边框只显示一半，解决方法如下

a)     给a添加display：block属性

五、行内块元素上下错位，解决方法如下

a)     给行内块元素设置vertical-align：top、middle、bottom

b)    给行内块元素设置浮动

六、页面中元素的默认的margin和padding不同，所以要求清除元素的默认margin和padding，方法如下：*{margin：0；padding：0}

七、两个上下关系的元素，间距默认为较大的margin，如果要margin之和，则需要让两个元素浮动

八、两个父子关系的元素，如果子元素设置了浮动且设置了margin-left，那么在IE6下面margin-left加倍，解决方法如下：

a)     给子元素设置display：inline

九、两个父子关系的元素，如果子元素设置了margin-top，那么父元素会同步下移，简介方法如下

a)     给父元素加边框

b)    在给子元素设置margin-top的同时，给父元素设置padding-top：0.1

c)     给子元素设置margin-top的同时，给父元素设置float

d)    不给子元素加margin-top，给父元素加padding-top

十、两个兄弟关系的元素，如果给第一个元素设置浮动，那么在IE6下面，两个元素是在一行显示的，且中间有3px间隙，解决方法：将第二个元素也设置浮动

十一、    如果要设置文本垂直居中，可以给该元素设置行高和高度相同的效果

十二、    IE6下面不支持将:hover加到非超链接上面，解决方法为：将内容用超链接包含起来，然后给超链接加:hover

十三、    标签最低高度设置min-height不兼容

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

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

备注：在B/S系统前端开时，有很多情况下我们有这种需求。当内容小于一个值（如300px）时。容器的高度为300px；当内容高度大于这个值时，容器高度被撑高，而不是出现滚动条。这时候我们就会面临这个兼容性问题

十四、     Ie6不支持fixed属性

十五、     IE 中Opacity定义的元素不透明

解决方法：filter：alpha（opacity=80）等同与opacity：0.8；