css - 锥形/淡化 CSS 框阴影？

Question

我有一个我正在尝试构建的 CSS 下拉菜单，下拉菜单的背景有一个褪色/锥形框阴影:

我无法实现如何让方框阴影真正变细/淡出。

这是我现在所在的位置:http://jsfiddle.net/Shpigford/f9aKR/

我试过使用 :before 和 :after 伪选择器等，但不太正确。

为澄清起见，我特别需要下拉菜单阴影方面的帮助。我的 jsFiddle 是精简版，以使示例尽可能简单明了。

Answer 1

1. 我添加了一个 before 元素。
2. 给它一个渐变背景(从透明到半透明的黑色)以实现从上到下的淡入淡出。
3. 给它一个内嵌框阴影来实现 in -> outfade。

看看-> http://jsfiddle.net/f9aKR/22/

根据需要编辑淡入淡出/颜色的数量。