通过专注于输入来改变跨度的风格

Question

我希望通过关注文本输入来显示单词“test”。 （当文本输入得到聚焦时，文本的z-index变为0） 但它不起作用。 （使用css。） 我的代码就在这里：

.text{
        position: absolute;
        z-index: -1;

    }
    .main{
        background: #ababab;
    }
    .input-textbox input:focus + span {
        z-index: 0;
    }
<div class="main">
    <div class="textbox">
        <input type="text" class="input-textbox">
        <span class="text">test</span>
    </div>
</div>

Answer 1

错误的选择器，请更改为以下

.input-textbox:focus + span {
    z-index: 0;
}

这是demo

Answer 2

尝试这样的选择器....

input.input-textbox:focus + span {
        z-index: 0;
}