1

我正在使用在这里找到的 css 阴影技术：

http://nicolasgallagher.com/css-drop-shadows-without-images/demo/

它使用之前和之后的伪类来赋予阴影更多形状。问题是我无法让阴影显示在其他元素上。

这是jsfiddle：http: //jsfiddle.net/S7dzj/6/

我尝试了具有不同 z 索引的 div 的各种相对定位。我也尝试在顶部div 中移动标题元素，没有帮助。我还尝试相对移动顶部divtop: -5px以使其位于标题div 下方，但仍然没有阴影。

有没有办法做到这一点？

4

2 回答 2

4

  1. 该z-index属性仅适用于 not 的元素position: static，因此您的.top类只是忽略了该属性。

  2. 你.header和.top类都有相同的z-index，所以标题出现在顶部。

请参阅更新的 jsFiddle。我所做的只是添加position: relative（它本身在视觉上不会做任何事情）.top并将其更改z-index为-2.

于 2012-09-02T01:04:42.117 回答
0

如果您希望阴影重叠.top，请参阅 animuson 的回答。

如果没有，请参阅http://jsfiddle.net/S7dzj/8/

.drop-shadow{
    margin-bottom:10px;
}

如果添加边距，您将看到阴影。

于 2012-09-02T01:08:21.987 回答