css3 边框和框阴影效果

Question

我不确定怎么做，但我想制作一个边框，并使用 box-shadow 在该边框上添加第二个较浅的图层，为整个事物添加深度，就像在这张图片中一样。

关于如何完成的任何建议？左边框是我想要实现的。

Answer 1

你可以尝试这样的事情，使用 box-shadow:

body { background: #555; }
div {
    background: #666;
    border: 1px solid #393939;
    box-shadow: inset 0 0 1px #999;
    width: 200px;
    height: 150px;
    margin: 20px;
    border-radius: 4px;
}

http://jsfiddle.net/2n2RE/

然后根据需要调整颜色值。您还可以更改 box-shadow 的模糊量以获得不同的外观。