<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
#div1 { width:200px; height:200px; border:1px solid #333;
background:-moz-linear-gradient(top, #FFFFFF,#000000);
background:-webkit-linear-gradient(top, #FFFFFF, #000000);
background:-ms-linear-gradient(top, #FFFFFF, #000000);
background:linear-gradient(top, #FFFFFF,#000000);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#FFFFFF, endColorstr=#000000)";
/*ie7下取一个中间值就行*/
+background:#f9f9f9; /*中间值*/
}
</style>
</head>
<body>
<div id="div1"></div>
</body>
</html>
上面是渐变的兼容性写法
2. ie6 7 下div浮动之后marginbottom会失效 解决办法是用padding
3.倾斜 旋转不兼容 直接切图
原文：http://www.cnblogs.com/chendian/p/5966062.html