小编Chr*_*rst的帖子

如何使用z-index与相对定位?

我的z-index和我的代码存在严重问题.我想在每一行都有一个弹出窗口并相对于该行定位.所以我创建了这段代码:

<div class="level1">
    <div class="level2">
        <input type="text" value="test1" />
        <div class="popup">test1</div>
    </div>
    <div class="level2">
        <input type="text" value="test2" />
        <div class="popup">test2</div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

与te以下风格

.level1
{
    position:relative;
    z-index:2;
}
.level2
{
    position:relative;   
    z-index:3;
}
.popup
{
    position:absolute;
    left:0px;
    top:10px;
    width:100px;
    height:100px;
    background:yellow;
    z-index:4;
}
Run Code Online (Sandbox Code Playgroud)

我知道我做错了什么,但我找不到我的愚蠢.

html css z-index css-position

38
推荐指数
3
解决办法
7万
查看次数

标签 统计

css ×1

css-position ×1

html ×1

z-index ×1