html – 使用CSS创建嵌入式暗阴影效果

我试图在CSS中获得类似于插入阴影效果的效果,如下图所示：

image of sunken button http://gyazo.com/5c3178208bb904b3502a83a7490f7ffc.png

有没有人知道如何用CSS获得这种效果？

最佳答案

答案已经给你(Box-shadow：inset ..),所以这里有一个快速演示它如何工作：

http://jsfiddle.net/L6nJj/

重要的部分是盒子阴影：插入2px 2px 3px 0红色.

有关可用选项的说明：https://developer.mozilla.org/en/css/box-shadow#Values

请务必考虑浏览器对Box-shadow的支持,即它在旧版本的IE中不起作用,但在“其他地方”工作：http://caniuse.com/css-boxshadow