5

我想将Wrapper-Top图层放在另一个图层之上。我设置了z-indexand position，应该足够了。我错过了什么吗？这是网站：提前谢谢你。

编辑：这是我使用的代码：

<body>
  <div class="Wrapper-Top">
  </div>
  <div class="Wrapper-Middle">
  hjklhjkhkjlhjkl
  </div>
</body>

.Wrapper-Top {
    min-width: 980px;
    width: 100%;
    height: 179px;
    top: 0px;
    left: 0px;
    background:url(img/header-bg.png)
    repeat-x 50% 0%;
    z-index: 20;
}
.Wrapper-Middle {
    min-width: 980px;
    width: 100%; 
    height: 300px;
    margin: 0 auto;
    background: #eee;
    top: 160px;
    left: 0px;
    position: absolute;
    z-index: 10;
    text-align: center;
}
4

3 回答 3

5

您缺少上的位置属性.Wrapper-Top。

MDN 上的 z-index

初始值：自动

适用于：定位元素

继承：无

当它不存在时，你的z-index:20in.Wrapper-Top什么也不做。

于 2013-05-24T07:37:23.593 回答
0

我想这就是你想要的..

<body>

<div class="Wrapper-Middle">
hjklhjkhkjlhjkl
 </div>
 <div class="Wrapper-Top">
 </div>


.Wrapper-Top{ min-width: 980px;
 width: 100%;
height: 179px;
top: 0px;
left: 0px;
background: url(img/header-bg.png) repeat-x 50% 0%;
z-index: 20;
position: absolute;
 }

.Wrapper-Middle{min-width: 980px;
width: 100%;
height: 300px;  
margin: 0 auto;
background: #eee;
top: 0px;
left: 0px;
z-index: 10;
text-align: center;
}
于 2013-05-24T07:37:13.490 回答
0

两者都使用绝对位置，并给出你想要的最高 z-index 值。像这样

.Wrapper-Top{top: 0px; left: 0px; position:absolute; z-index: 2; }
.Wrapper-Middle{top: 160px; left: 0px; position: absolute; z-index: 1;}
于 2013-05-24T07:53:02.363 回答