css - 固定和绝对定位 div 下的文本

Question

我有这样的东西(只是设计的一部分)http://jsfiddle.net/eoL458o0/1/我需要将文本放在顶部的 .content 中，因为 anchor 现在不可点击。 #gradient 是固定的，因为背景图片也是固定的，#empty 有绝对位置，因为我需要覆盖整个 body 并且它必须是可滚动的，有使用 jQuery 动态设置高度。

感谢您的帮助。

#empty {
    background-color: rgba(99,115,99,0.25);
    margin-top: 200px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#gradient {
background: rgba(255,255,255,0);
background: -moz-radial-gradient(50% 65%, ellipse cover, rgba(255,255,255,0) 0%, rgba(0,0,0,0.50) 100%);
background: -webkit-gradient(radial, 50% 65% 50% 65%, 0px, 50% 65% 50% 65%, 100%, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,0.50)));
background: -webkit-radial-gradient(50% 65%, ellipse cover, rgba(255,255,255,0) 0%, rgba(0,0,0,0.50) 100%);
background: -o-radial-gradient(50% 65%, ellipse cover, rgba(255,255,255,0) 0%, rgba(0,0,0,0.50) 100%);
background: -ms-radial-gradient(50% 65%, ellipse cover, rgba(255,255,255,0) 0%, rgba(0,0,0,0.50) 100%);
background: radial-gradient(ellipse at 50% 65%, rgba(255,255,255,0) 0%, rgba(0,0,0,0.50) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=1 );

position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;

}

.content {
    color: #000; 
    margin-top: 200px;
}

<div class="container content" role="main">
	<div class="row">
	    <p class="col-md-6">
            Lorem ipsum dolor sit amet, <a href="#">consectetur adipisicing</a> elit.
	    </p>
    </div>
</div> <!-- /container -->
<div id="gradient"></div>
<div id="empty"></div>

Answer 1

在你的CSS中，只需添加:

z-index:-1;

到那两个div，所以他们去底部