用内框阴影画一个圆圈

Question

我想用内盒阴影绘制几个圆圈.

这是我的JsFiddle

CSS

.circle {
 width: 20px;
 height: 20px;
 display: inline-block;
 border-radius: 50%;
 border:1px solid #000;

}

如何在圆圈中应用内部阴影

Answer 1

指定inset内部阴影,x和y位移,模糊和颜色.例:

box-shadow: inset 3px 3px 4px #000;

演示:http://jsfiddle.net/uJzgs/2/

兼容性:

-webkit-box-shadow: inset 3px 3px 4px #000;
-moz-box-shadow: inset 3px 3px 4px #000;
box-shadow: inset 3px 3px 4px #000;