圆角阴影及文字阴影

圆角阴影

#main .content{
width: 1024px;
margin:0 auto;
overflow:hidden;
background-color: #fff;
-webkit-box-shadow: 0 2px 3px rgba(34, 25, 25, 0.4);//阴影实现
-moz-box-shadow: 0 2px 3px rgba(34, 25, 25, 0.4);//阴影实现
box-shadow: 0 2px 3px rgba(34, 25, 25, 0.4);//阴影实现
-moz-border-radius: 10px;//圆角实现
-webkit-border-radius: 10px;//圆角实现
border-radius: 10px;//圆角实现
behavior:url(./PIE.htc);

 

文字阴影：

text-shadow:#666 1px 1px 8px;

 

 

控制各个位置圆角

#box {

   -webkit-border-top-left-radius: 10px;

   -webkit-border-top-right-radius: 20px;

   -webkit-border-bottom-right-radius: 30px;

   -webkit-border-bottom-left-radius: 40px;

}

 

 

定义各个位置圆角 兼容各大浏览器

 

-moz-border-radius-bottomleft: 4px;
-webkit-border-bottom-left-radius: 4px;
-ms-border-bottom-left-radius: 4px;
-o-border-bottom-left-radius: 4px;
border-bottom-left-radius: 4px;

-moz-border-radius-bottomright: 4px;
-webkit-border-bottom-right-radius: 4px;
-ms-border-bottom-right-radius: 4px;
-o-border-bottom-right-radius: 4px;
border-bottom-right-radius: 4px;

 

 

-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;