Css 我的文字后面看背景位置绝对

我有一些代码，希望使导航高于滑块bg。 因此，我将

位置：绝对
插入到.slider

<div class="nav">
        nav
</div>
<div class="slider"><img src="http://lorempixel.com/400/200/"></div>
<div class="content">content</div>



.nav{
    z-index:99999;
    color:#F00;
    background:transparant;
}
.slider{
    z-index:1;
    top:0 !important;
    position:absolute;
    width:100%;
    height:100%;
    left:0;
    right:0;
}

小提琴：
使其他
div
相对定位，如：


HTML

<div id="cont">
    <div class="nav">all nav</div>
    <div class="slider">my slider</div>
    <div class="content">my content</div>
</div>

z索引将显示内容的前面或后面

<div class="nav"><!--all nav--></div>
<div class="slider"><!--my slider--></div>
<div class="content"><!--my content--></div>

当你的z指数高于上div时，就像你的一个div z指数是9，另一个是99，那么99 div在所有的前面

关于z指数的最好例子。
创建一个。我们将在几秒钟内修复它并进行解释。我有更新和使用fiddle，请不要-1我的问题我不确定你想把文本放在哪里，检查面条编辑的答案。但是您已经启用了
z-index
，如果将其设置为
-1
，文本将显示在顶部@Ruddy:对nav来说是的，但我希望在slider之后有内容。。。[请不要“-1”我的问题：（]我没有问你的问题。对我来说这不是一个糟糕的问题。@lui:所以你想要
滑块
在
nav
旁边或
nav
下面？nav有位置99，滑块有低于nav的背景。滑块之后是内容…所以[[nav]滑块][内容]@路易：伙计..你在吗？是的，但我想作为样本的内容，但关于文本。please@lui：你没听懂……你能换句话问一下吗？
html,body,#cont {
    width:100%;
    height:100%;
    margin:0;
    padding:0;
}
.nav {
    border:1px solid red;
    width:100%;
    height:10%;
    position:relative;/* added */
}
.slider {
    position:absolute;
    border:1px solid green;
    left:0;/* added */
    right:0;/* added */
    height:20%;/* added */
}
.content {
    border:1px solid black;
    position:relative;/* added */
    top:20%;/* added - same as absolute div height */
}

<div class="nav"><!--all nav--></div>
<div class="slider"><!--my slider--></div>
<div class="content"><!--my content--></div>

nav {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999; 
    height: 50px;
    width: 100%;
    background-color: #000;
}
.slider{
    position: absolute;
    top: 50px;
    left: 0;
    z-index: 999;
    height: 300px;
}
.content {
    position: absolute;
    top: 300px;
    left: 0;
    z-index: 9999;
}