box-shadow：<length><length><length><length>|| <color>

CSS3盒阴影效果不仅支持盒外阴影，还支持内阴影，使用时增加一个inset属性即可。例如：box-shadow: inset 0 0 1px #fff;所表示的含义是没有偏移，1像素模糊的白色内阴影。

box-shadow还支持多阴影，例如：box-shadow: inset 0 0 1px #fff, inset 4px 4px 20px  rgba(255,255,255,0.33), inset -2px -2px 10px rgba(255,255,255,0.25);所表示的含义是，无偏移1像素模糊白色阴影重叠于左上角4像素偏移20像素模糊透明度0.33的白色内阴影再重叠于右下角偏移2像素，模糊10像素，透明度0.25的白色内阴影。

.drop-shadow.top {box-shadow: 0 -4px 2px -2px rgba(0,0,0,0.4);
}.drop-shadow.right {box-shadow: 4px 0 2px -2px rgba(0,0,0,0.4);
}.drop-shadow.bottom {box-shadow: 0 4px 2px -2px rgba(0,0,0,0.4);
}.drop-shadow.left {box-shadow: -4px 0 2px -2px rgba(0,0,0,0.4);
}

.emphasize-dark {box-shadow: 0 0 5px 2px rgba(0,0,0,.35);
}.emphasize-light {box-shadow: 0 0 0 10px rgba(255,255,255,.25);
}.emphasize-inset {box-shadow: inset 0 0 7px 4px rgba(255,255,255,.5);
}.emphasize-border {box-shadow: inset 0 0 0 7px rgba(255,255,255,.5);
}

.embossed-light {border: 1px solid rgba(0,0,0,0.1);box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}.embossed-heavy {border: 1px solid rgba(0,0,0,0.1);box-shadow: inset 0 2px 3px rgba(255,255,255,0.3),inset 0 -2px 3px rgba(0,0,0,0.3),0 1px 1px rgba(255,255,255,0.9);
}

-webkit-border-radius: 40px;

-webkit-box-shadow: 0 0 1px #fff, 0 0 3px #000, 0 0 3px #000;

-moz-border-radius: 40px;

-moz-box-shadow: 0 0 1px #fff, 0 0 3px #000, 0 0 3px #000, inset 0 1px  #fff, inset 0 12px rgba(255,255,255,0.15), inset 0 4px 10px #cef, inset  0 22px 5px #0773b4, inset 0 -5px 10px #0df;

height: 34px;

width: 80px;

border-radius: 40px;

background: #034a76;

box-shadow: 0 0 1px #fff, 0 0 3px #000, 0 0 3px #000, inset 0 1px  #fff, inset 0 12px rgba(255,255,255,0.15), inset 0 4px 10px #cef, inset 0  22px 5px #0773b4, inset 0 -5px 10px #0df;