Html 如何在一个div的两侧进行CSS3 boxshadow？

请查看以下简单代码：

长方体的四个侧面都有一个内部长方体阴影。我需要框阴影只出现在左侧和底部

如何更改此代码：

box-shadow: inset 0 0 9px 0 #000;

---

这是否有帮助，这应该可以跨浏览器工作

.shadow {

    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 4px #000;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');

}

以下是原作者：

见本页：

---

只需对颜色和偏移量做一点小小的更改，它就变得相当简单：

div { width: 300px; height: 300px; 

   box-shadow: inset 5px 5px 5px -3px #666;

}

---

它的最大优点。

我打算建议使用负值，如下所示：

div { width: 300px; height: 300px;
    /* Try this. */
    box-shadow: inset 4px -4px 7px -4px #000; 
}

第一个4px将阴影框向左推4px，如果将其保留为0，则隐藏通常在右侧看到的内容

第二个-4px值垂直向下推阴影，再次隐藏顶部阴影

较高的7px模糊值会使我获得比我需要的更高的模糊度，但是如果我添加-4px的扩展，那么额外的模糊度将被剪裁。只留下柔和的灰色阴影边缘，而不是你通常看到的坚硬的黑色边缘

请参见我的示例：

---

您不能仅将阴影应用于

的某些侧面，但可以调整X和Y偏移，以便在不需要的侧面剪裁阴影

这给了我你在Safari中想要的效果：

box shadow:7px-7px 9px#000插图

div { width: 300px; height: 300px;
    /* Try this. */
    box-shadow: inset 4px -4px 7px -4px #000; 
}