boxshadow

 box-shadow:水平偏移+- 垂直偏移+- 模糊度+ 向外扩展+ 阴影颜色 向内或者向外（inset）默认向外；

<div class="boxShadow">
	<a href="#" class="a1">简单的偏移阴影</a>
    <a href="#" class="a2">偏移模糊阴影</a>
    <a href="#" class="a3">外发光效果</a>
    <a href="#" class="a4">内阴影</a>
    <a href="#" class="a5">盒子阴影可以嵌套，依次往后叠加，就是第一个是在最上层。</a>
    
    <a href="#" class="a6">可以制作高光</a>
    
    <a href="#" class="a7">高光、内阴影、外阴影</a>
</div>

　　

a{ display:block; background-color:#F5F5F5; border:#ccc solid 1px; margin-bottom:24px;}
a{ 400px; height:40px; line-height:40px; color:#333; text-decoration:none; padding:10px; border-radius:30px;}
/*------------------------------------------------------------------------------------*/
/*说明: box-shadow:水平偏移+- 垂直偏移+- 模糊度+ 向外扩展+ 阴影颜色 向内或者向外（inset）默认向外；</p>*/

.a1{ box-shadow:5px 5px 0 rgba(0,0,0,0.8);}
.a2{ box-shadow:5px 5px 5px 0 	rgba(0,0,0,0.8);}
.a3{ box-shadow:0 	0 	5px 3px rgba(0,0,0,0.6);}
.a4{ box-shadow:0 	0 	5px 3px rgba(0,0,0,0.6) inset;}
.a5{ box-shadow:0 	0 	0 	1px rgba(204,0,0,1),0 	0 	0 	4px rgba(0,146,10,0.4);} /*第一个红色,第二个绿色*/

.a6{ box-shadow:0 	1px 0 	0 rgba(204,0,0,1) inset;}
.a7{ background-color:#BE1C8B;
	box-shadow:0 6px 6px -2px rgba(255, 255, 255, 0.7) inset, 0 -5px 10px 3px rgba(0, 0, 0, 0.6) inset, 0 8px 10px 2px rgba(0, 0, 0, 0.3)}/*向外扩张貌似可以用-*/
</style>