Css 在div容器上放置阴影？

我有一个带有自动建议的搜索框，它下面会弹出一个div，上面有多个搜索字符串建议（比如谷歌）。是否可以使用CSS在自动建议框上放置阴影，或者我需要某种脚本？我尝试了背景图像，但建议的数量可以从1到10或15不等

---

如果可能的话，我更喜欢在IE6+和FF2+中工作的东西。谢谢

CSS3有一个

框阴影

属性。目前需要供应商前缀以实现最大浏览器兼容性

div.box-shadow {
    -webkit-box-shadow: 2px 2px 4px 1px #fff;
    box-shadow: 2px 2px 4px 1px #fff;
}

---

有一个生成器可供使用。

实现这一点的最广泛兼容方式可能是在自动建议框下创建第二个div，大小与框本身相同，向下和向右移动几个像素。您可以使用JS来创建和定位它，如果您使用的是相当现代的框架，这应该不会太困难。

您可以尝试使用PNG下拉阴影。IE6不支持它，但是它会很好地降级

---

您可能想试试这个。看起来很简单，至少可以在IE6和Moz上使用

<div id ="show" style="background-color:Silver;width:100px;height:100px;visibility:visible;border-bottom:outset 1px black;border-right:outset 1px black;" ></div>

一般语法为： 边框-[位置]：[边框样式][边框宽度][边框颜色]；继承

可用的[边框样式]列表包括：

• 冲刺
• 点缀
• 双重的
• 沟槽
• 隐藏的
• 插图
• 没有
• 开始
• 山脊
• 坚实的
• 继承

---

这适用于我所有的浏览器：

.shadow {
-moz-box-shadow: 0 0 30px 5px #999;
-webkit-box-shadow: 0 0 30px 5px #999;
}

---

然后只需为任何div指定shadow类，不需要jQuery。

只需注意，要使绝对定位正确，自动建议框必须绝对定位或相对定位。如果无法为自动建议框设置固定高度，该怎么办？建议的数量在1-15之间。是的，你可以用右边的背景图像制作一个你喜欢的任何形状的主框，并为阴影制作一个相同形状的全黑色主框，并调整不透明度以获得你想要的效果。-我发现这个网站有很多不同阴影效果的好例子。IE9不需要单独使用box shadow吗？在最新版本的主流浏览器中，

box shadow

应该可以正常工作。再也不需要供应商前缀了。加上simon verbeke的评论，在我从-moz-box-shadow切换到box-shadow之前，box-shadow在ff中对我根本不起作用+1.只是添加了一个边框，而没有阴影。

.shadow {
    -moz-box-shadow:    3px 3px 5px 6px #ccc;
    -webkit-box-shadow: 3px 3px 5px 6px #ccc;
    box-shadow:         3px 3px 5px 6px #ccc;
}