我有一个非常恼人的问题,那就是我的z-index不工作而div位于(在y轴上方)而不是在(在z轴上)另一个div上方.
这可能是完全明显的,但我看不出我的代码有问题.谁能发现我哪里错了?它应该是如此简单,但我感到非常沮丧,因为我找不到解决方案.
<style>
.greenleftarrow{
position: relative;
z-index:10;
display:block;
background:#fff url(./images/greenleftarrow.jpg) no-repeat;
left:10px;
top: 0px;
height:140px;
opacity:0.5;
filter:alpha(opacity=50);
}
</style>
<body id="body1" style="position: relative; z-index:-1; height: 510px;" onload="javascript:showAndroidToast('1'); inspectLang(); getDocHeight()">
<div class="greenleftarrow" id="greenleftarrow" ></div>
<div style="position: relative; z-index:-1;">body body body body</div>
</body>
Run Code Online (Sandbox Code Playgroud)
尝试将箭头的位置更改为绝对值.
.greenleftarrow{
position: absolute;
z-index:10;
display:block;
background:#fff url(./images/greenleftarrow.jpg) no-repeat;
left:10px;
top: 0px;
height:140px;
opacity:0.5;
filter:alpha(opacity=50);
}
Run Code Online (Sandbox Code Playgroud)