1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>无标题文档</title> 6 <style type="text/css"> 7 <!-- 8 #div1 9 { 10 width:300px; 11 height:200px; 12 border:#ad0000 1px solid; 13 background-color:#39F; 14 } 15 #div1 16 { 17 -ms-border-radius:8px; 18 -moz-border-radius:8px; 19 -webkit-border-radius:8px; 20 -khtml-border-radius:8px; 21 -o-border-radius:8px; 22 border-radius:8px; 23 } 24 #div2 25 { 26 width:300px; 27 height:200px; 28 border:#ad0000 1px solid; 29 } 30 #div2 31 { 32 /*设置过渡效果*/ 33 background-image:-moz-linear-gradient(top,#accff7,#4d94f4); /*用于火狐浏览器*/ 34 background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#accff7),color-stop(1,#4d94f4)); /*用于Safari和Chrome浏览器*/ 35 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#accff7',endColorstr='#4d94f4',GradientType='0'); /*用于IE6 & IE7浏览器*/ 36 background: -ms-linear-gradient(top,#accff7,#4d94f4); /* CSS3 针对IE的写法。主要是IE10以前的版本不支持css3，所以对IE要写两个语句*/ 37 } 38 --> 39 </style> 40 </head> 41 42 <body> 43 <div id="div1"> </div> 44 <br /> 45 <div id="div2"></div> 46 </body> 47 </html>