Question

我想选择确切元素来应用悬停效果。但不是继承。

<div class="parent">
    <div class="child"> <-- not here
        <div class="parent">
            <div class="child"></div> <-- apply hover effect
        </div>
    </div>
</div>

只有CSS才有可能吗？如果只有CSS不可能，你可以给我一个想法angularjs指令。目标是我想制作一个可重复使用的，可扩展的angularjs指令或CSS类。

谢谢。

修改结构更清晰。

<div class="custom-scroller">
    <div class="custom-scrollbar"> <-- not here
        <dynamic-multi-layer-elements>
            ... <-- lots of dynamic number of elements here
            <div class="custom-scroller"> <-- it might be many times nested
                <div class="custom-scrollbar"></div> <-- apply hover effect
            </div>
            ... <-- lots of elements closed
        </dynamic-multi-layer-elements>
    </div>
</div>

Answer 1

你可以这样做：

.parent > .child > .parent > .child:hover
{
    color: red;
}

Answer 2

.parent .parent > .child:hover
{
color:green;
}

你可以这样做

如何选择当前元素来应用悬停效果？没有继承

2 个答案: