Question

我知道其他人也有类似的问题，但他们的解决方案不起作用。以下是什么原因？

div.line_container:hover #sidebar_loader1 {
z-index: 2;
}

上面的代码确实改变了z-index。

div:hover #sidebar_loader1 {
z-index: 2;
}

但这个确实如此。

这是什么原因，因为我需要知道因为我只需要那个课程来改变风格。请帮忙。

我的HTML代码

<img src="" alt="image" id="logo">

<div class="line_container">
    <img src="http://png.findicons.com/files/icons/1580/devine_icons_part_2/128/png.png" alt="IMAGE" class="line_image">
    <span class="line_text">
        THIS IS SOME SAMPLE TEXT >
    </span>
</div>

<div class="sidebar_loader" id="sidebar_loader1">
    TEST for 1
</div>

<div class="line_container">
    <img src="http://png.findicons.com/files/icons/1580/devine_icons_part_2/128/png.png" alt="IMAGE" class="line_image">
    <span class="line_text">
        THIS IS SOME SAMPLE TEXT >
    </span>
</div>

<div class="sidebar_loader" id="sidebar_loader2">
    TEST for 2
</div>

<div class="line_container">
    <img src="http://png.findicons.com/files/icons/1580/devine_icons_part_2/128/png.png" alt="IMAGE" class="line_image">
    <span class="line_text">
        THIS IS SOME SAMPLE TEXT >
    </span>
</div>

<div class="sidebar_loader" id="sidebar_loader3">
    TEST for 3
</div>

</div>

Answer 1

#sidebar_loader_1 不是div.line_container的后代，因此使用后代组合子（空格）不正确。

尝试兄弟组合子。 +或~应该有效。

Answer 2

ID为sidebar_loader1的div未嵌套在任何具有类line_container的div中

为什么我的元素在悬停时不会改变样式？

2 个答案: