Question

我正在寻找一种方法，在div“方框”周围有一个非常漂亮的阴影。

如何在所有浏览器中完成此操作？

我做过研究，发现人们有很多只能在更强大的浏览器中使用的阴影示例。

我应该以某种方式使用图片吗？我怎么能这样做？有什么想法吗？

Answer 1

有几个选择。 CSS3 box shadows就是其中之一。您还可以将CSS3PIE用于不支持CSS3框阴影的浏览器，但您会发现它看起来与现代浏览器中的CSS3阴影不完全相同。除此之外，你可以使用你在Photoshop之类的东西中创建的阴影，然后使用背景图像将它们放在你的div的“后面”和另一个div，并使用定位来偏移你的“顶部”div，以便显示阴影。

Answer 2

如果您想支持IE7等旧浏览器，则应使用图像。否则你可以尝试这样的事情：

div.shadow {
   -moz-box-shadow: 3px 3px 5px #777;
   -webkit-box-shadow: 3px 3px 5px #777;
   box-shadow: 3px 3px 5px #777;
}

当然可以通过<div class="shadow">…</div>

使用它

我怎么能在div元素周围有阴影？

2 个答案: