css圆角与阴影,[iecss3.htc文件需要下载]

View Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
*{margin:0; padding:0;}
/*圆角、阴影、透明度*/
.box {
    margin-left:50px;
    margin-top:50px;
    width:300px; height:300px;
    background:#eee;

    /*下面是圆角*/
    -moz-border-radius: 12px; /* Firefox */
    -webkit-border-radius: 12px; /* Safari and Chrome */
    border-radius: 12px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */

    /*下面是阴影*/        /*box-shadow参数对应[x偏移,y偏移,模糊度,阴影颜色][x与y偏移可取负值]IE不支持负值*/
    -moz-box-shadow: 3px 3px 3px #000; /* Firefox */
    -webkit-box-shadow: 3px 3px 3px #000; /* Safari and Chrome */
    box-shadow: 3px 3px 3px #000;/* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */

    /*ie圆角与阴影需要此文件*/    /*下面可以兼容ie文件,需在服务器上才能执行*/
  behavior: url(http://iz100.com/ie-css3.htc); /* This lets IE know to call the script on all elements which get the 'box' class */
}
</style>
</head>

<body>
<div class="box"></div>
</body>
</html>

效果图:

原文地址:https://www.cnblogs.com/iz100/p/2689940.html