[分享]css兼容性问题有哪些

随着移动互联网的快速发展，越来越多的人选择使用手机进行上网浏览。但是，不同的浏览器和操作系统都对CSS的支持不同，导致了在不同浏览器上网页的表现效果不同。因此，CSS兼容性问题也变得越来越重要。下面是...

随着移动互联网的快速发展，越来越多的人选择使用手机进行上网浏览。但是，不同的浏览器和操作系统都对CSS的支持不同，导致了在不同浏览器上网页的表现效果不同。因此，CSS兼容性问题也变得越来越重要。

下面是一些常见的CSS兼容性问题：

/* IE6和IE7下的浮动问题 */
.div {
    float: left;
    *zoom: 1;
    *display:inline;
}

/* IE6下的透明度问题 */
.ie6 .div {
    filter: alpha(opacity=50);
}

/* Safari和Chrome下的强制文本折行问题 */
.div {
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* IE下的overflow:hidden问题 */
.div {
    overflow: hidden;
    zoom: 1;
}

/* Firefox下的input[type=file]问题 */
input[type=file] {
    background: url("file.jpg");
}

/* IE下的背景图片问题 */
.div {
    background-image: url(image.png);
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="image.png",sizingMethod='scale');
}

/* Safari和Chrome下的未知属性问题 */
.div {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

/* Firefox和IE下的不同字体问题 */
.div {
    font-family: "Microsoft YaHei", Arial, sans-serif;
} 

这些问题只是CSS兼容性问题的冰山一角，实际开发中还会遇到更多的问题。因此，要想保证网站在不同浏览器和操作系统上的表现效果一致，我们需要做好CSS兼容性处理工作。