阴影没有出现

Question

我试图在其中一个div中放置阴影并且它没有显示出来.这是我试图实现阴影的一个div:

#intro {
    padding: 0px;
    margin: 0px auto;
    width: 100%;
    float:inherit;
    overflow: hidden;
    height: 800px;
    position:inherit;
    background-color: #00b3e1;; 
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
}

这是URL:http://rachelchaikof.com/awareness/

Answer 1

你无法看到阴影的原因是因为下一个div(#one)正好位于它下面,而阴影正在#one下面呈现.从#one中删除背景图像,阴影变得可见.

将其添加到#intro的CSS中以使阴影可见:

position: relative;
z-index: 10;

如果您希望在其他文本区域上显示阴影,则还需要调整其z-index值,顶部元素(#intro)具有最高值.