Html CSS对div的所有四边进行阴影处理

我希望在CSS中实现这一点，而不是CSS3，因为我希望所有浏览器都支持它

---

一个包含内容的div，每边都有阴影。顶部区域将用于导航。我已经搜索了教程，但到目前为止没有结果。救命啊

您必须创建多个图像。左边一个。右边一个。一个用于底部等，然后有几个div，并为每个div设置背景。

假设三个div的宽度相同（固定），则可以使用三个div：

你好，世界

.顶{
背景：url（'top.png'）；
高度：20px；
宽度：800px；
}
.中{
背景：url（'middle.png'）repeat-y；
宽度：800px；
}
.底部{
背景：url（'bottom.png'）；
高度：20px；
宽度：800px；
}

或者，您可以制作一个大图像，并将其用作整个内容区域的背景；然后硬编码所包含元素的位置和大小。

是一种工具，允许您在IE中使用一些css3属性

您试图做的是在较新的浏览器中相当广泛地使用css3，并且在IE中使用您可以从那里下载的.htc文件很好地（并且很容易）模拟css3

至于标记，我只看到2个元素，例如，顶部的元素向右浮动。您必须使用z索引来隐藏多余的阴影。

---

在那个网站上也有一个非常相似的效果，你应该能够根据你的需要调整它。

正如Ventus所说，在ie中使用css阴影是不可能的（只有ie9）。但是你可以用。这是一个很棒的jquery插件，使用非常简单。有了它，您将具有跨浏览器兼容性。

这应该适用于所有浏览器：

.allSidesShadow { box-shadow: 2px 2px 19px #aaa; -o-box-shadow: 2px 2px 19px #aaa; -webkit-box-shadow: 2px 2px 19px #aaa; -moz-box-shadow: 2px 2px 19px #aaa; /* For IE 5.5 - 7 */ /* for IE4 - IE7 */ filter: progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=1, Color=#C4C4C4), progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=90, Color=#C4C4C4), progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=180, Color=#C4C4C4), progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=270, Color=#C4C4C4); -ms-filter: " progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=1, Color=#C4C4C4), progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=90, Color=#C4C4C4), progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=180, Color=#C4C4C4), progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=270, Color=#C4C4C4) "; } .allSidesShadow{ 箱形阴影：2×2×19px#aaa； -o形盒阴影：2×2×19px#aaa； -网络工具包盒阴影：2px 2px 19px#aaa； -moz盒阴影：2px29px#aaa； /*对于IE 5.5-7*/ /*对于IE4-IE7*/ 过滤器： progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=1，颜色=C4）， progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=90，颜色=C4）， progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=180，颜色=C4）， progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=270，颜色=C4）； -ms过滤器：“ progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=1，颜色=C4）， progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=90，颜色=C4）， progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=180，颜色=C4）， progid:DXImageTransform.Microsoft.Shadow（强度=9，方向=270，颜色=C4） "; }

---

Box Shadow适用于所有现代[IE>8]浏览器，此代码不使用图像，适用于IE版本低于9的所有浏览器

 box-shadow:2px 2px 10px 10px #C9C9C9;
 -webkit-box-shadow:2px 2px 10px 10px #C9C9C9;
 -moz-box-shadow:2px 2px 10px 10px #C9C9C9;

  /* For IE<9 */  
  filter:
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=0,strength=5),
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=45,strength=2),
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=90,strength=5),
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=135,strength=5),
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=180,strength=10),
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=225,strength=5),
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=270,strength=5),
  progid:DXImageTransform.Microsoft.Shadow(color=#C9C9C9,direction=315,strength=2);

box shadow:2px2px10px 10px#C9C9C9；
-webkit盒阴影：2px 2px 10px 10px#C9C9C9；
-moz盒阴影：2PX2PX10PX10PX#C9C9C9；
/*对于IESekar发布的答案，需要进行一些编辑

box-shadow:2px 2px 10px 10px #C9C9C9;
-webkit-box-shadow:2px 2px 10px 10x #C9C9C9;
-moz-box-shadow:2px 2px 10px 10px #C9C9C9;

这在IE上不起作用（我检查了IE8）

表示左0像素，右0像素，3倍模糊，0像素漫反射，使用比背景稍暗的颜色。
我现在看不到您的图片，但对于所有侧面阴影，我使用以下代码：

box-shadow: 0 0 5px 0 #000;

使用您的尺寸代替5px。
您可以在div中放置以下代码，以便在所有四个面上放置阴影

-webkit-box-shadow: 0 0 10px rgba(0,0,0,.1);
box-shadow: 0 0 10px rgba(0,0,0,.1);    

悲伤，但IE不显示用CSS制作的阴影。您需要创建图像作为阴影（一些GIF，IE6不显示png文件的alpha通道）这是一个动态框。。。这意味着宽度/高度会随着内容的不同而变化吗？为了实现跨浏览器兼容性，只使用CSS放置阴影…请查看这些链接，以获得良好的参考。几个月前我就用过了，但出于某些原因我离开了它。谢谢你提醒@当然，谢谢你指出，我已经更新了风格，使其在IE中工作。只有最后一个过滤器适用于我。为了让IE8中的各方都为我工作，我必须去掉逗号。根据MSDN的以下文章，它们之间用空格分隔，而不是逗号：
box-shadow: 0 0 5px 0 #000;

-webkit-box-shadow: 0 0 10px rgba(0,0,0,.1);
box-shadow: 0 0 10px rgba(0,0,0,.1);