有没有办法只在底部投下阴影？。我有一个菜单，旁边有两张图片。我不想要正确的阴影，因为它与正确的图像重叠。我不喜欢使用图像，所以有没有一种方法可以将其仅放在底部，如：
box阴影底部：10px#FFF或类似
-moz盒影：0px 3px 3px#000；
-网络工具包盒阴影：0px 3px 3px#000；
箱形阴影底部：5px#000；
/*对于IE 8*/
-ms过滤器：“progid:DXImageTransform.Microsoft.Shadow（强度=4，方向=180，颜色='#000000'）”；
/*对于IE 5.5-7*/
过滤器：progid:DXImageTransform.Microsoft.Shadow（强度=4，方向=180，颜色=000000）；
更新4
与更新3相同，但使用现代css（=更少的规则），因此不需要在伪元素上进行特殊定位
\box{
背景色：#3D6AA2；
宽度：160px；
高度：90px；
位置：绝对位置；
顶部：calc（10%-10px）；
左：计算（50%-80px）；
}
.盒子阴影：之后{
内容：“；
位置：绝对位置；
宽度：100%；
底部：1px；
z指数：-1；
变换：比例（.9）；
盒影：0px 0px 8px 2px#000000；
}<；div id=“box”class=“box shadow”></部门>更新3
我以前的所有答案都是使用额外的标记来获得这种效果，这并不一定需要。我认为这是一个更清洁的解决方案。。。唯一的技巧是使用这些值来获得阴影的正确位置以及阴影的正确强度/不透明度。这是一个使用伪元素的新提琴：
http://jsfiddle.net/UnsungHero97/ARRRZ/2/
HTML
<；div id="；方框“；类别=“类”；盒影“&燃气轮机</部门>；
CSS
#框{
背景色：#3D6AA2；
宽度：160px；
高度：90px；
边缘顶部：-45px；
左边距：-80px；
位置：绝对位置；
最高：50%；
左：50%；
}
.盒子阴影：之后{
内容：“"；”；；
宽度：150px；
高度：1px；
边缘顶端：88px；
左边距：-75px；
显示：块；
位置：绝对位置；
左：50%；
z指数：-1；
-网络工具包盒阴影：0px 0px 8px 2px#000000；
-moz盒阴影：0px 0px 8px 2px#000000；
盒影：0px 0px 8px 2px#000000；
}
更新2
显然，正如其他人所指出的那样，您只需为box shadow CSS添加一个额外的参数就可以做到这一点。下面是演示：
http://jsfiddle.net/K88H9/821/
CSS
-webkit盒阴影：0 4px 4px-2px 000000；
-moz盒阴影：0 4px 4px-2px 000000；
盒影：0 4px4px-2px#000000；
这将是一个更好的解决方案。添加的额外参数如下所述：
第四个长度是一个排列
距离正值会导致
阴影形状将全部展开
指定半径的方向。
负值会导致阴影形状
收缩
更新
查看JSFIDLE上的演示：http://jsfiddle.net/K88H9/4/
我所做的就是创建一个；阴影元素“；这将隐藏在您希望有阴影的实际元素后面。我测量了“的宽度”；阴影元素“；比实际元素的宽度小2倍于指定的阴影；然后我把它校准好了
HTML
<；div id="；包装纸&燃气轮机；
<；div id="；“元素”&燃气轮机</部门>；
<；div id="；影子“&燃气轮机</部门>；
</部门>；
CSS
包装器{
宽度：84px；
位置：相对位置；
}
#元素{
背景色：#3D668F；
高度：54px；
宽度：100%；
位置：相对位置；
z指数：10；
}
#影子{
背景色：#3D668F；
高度：8px；
宽度：80px；
左边距：-40px；
位置：绝对位置；
底部：0px；
左：50%；
z指数：5；
-网络工具包盒阴影：0px 2px 4px#000000；
-moz盒阴影：0px 2px 4px#000000；
盒影：0px 2px 4px#000000；
}
原始答案
是的，您可以使用提供的相同语法执行此操作。第一个值控制水平定位，第二个值控制垂直定位。因此，只需将第一个值设置为0px，将第二个值设置为所需的偏移量，如下所示：
-webkit盒阴影：0px 5px#000000；
-moz盒阴影：0px 5px#000000；
盒影：0px 5px#000000；
有关长方体阴影的详细信息，请查看以下内容：
- http://www.css3.info/preview/box-shadow/
- https://developer.mozilla.org/en/css/-moz-box-shadow#Browser_compatibility
- http://www.w3.org/TR/css3-background/#the-盒影
我希望这有帮助