首页 > 代码库 > css兼容问题

css兼容问题

1.IE6下元素最小高度19px

解决方案:
设置该元素的 overflow:hidden;

2.IE6下display:inline-block不管用

解决方案:

display: inline-block;
*display:inline;
*zoom:1;

3.当元素浮动后再设置margin那么就会产生双倍边距

解决方案:
针对ie6、7添加 *display:inline

4.li里元素都浮动, li 在IE6 7  下,会产生4px间隙问题

解决方案:

针对ie6,7给 li  添加 *vertical-align: top;

5.两个浮动元素中间有注释或者内联元素并且和父级宽度相差不超过3px,导致多复制一个文字问题

解决方案:
1、两个浮动元素中间避免出现内联元素或者注释
2、与父级宽度相差3px或以上

6.

\9 IE10以及IE10以下版本的
* IE7以及IE7以下版本的
_ IE6以及IE6以下版本的

例如:

div{
width: 200px;
height: 200px;
background-color: red
background-color: blue\9;
*background-color: green;
_background-color: yellow;
}

7.IE6不支持png24 图片。

解决方案:
(1)JS插件(问题:不能处理body之上png24)

  DD_belatedPNG.fix(‘xxx‘);   //xxx表示作用的元素,如img,div等

 (2)原生滤镜

  _background:none;

  _filter : progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.mamicode.com/XX.png", sizingMethod="crop");

例如:

body{
width: 500px;
height: 500px;
background:red url("img/png.png") no-repeat;
_background-image:none;
_filter : progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.mamicode.com/img/png.png", sizingMethod="crop");
}

css兼容问题