html - 使用 :not 删除格式

Question

我有一个班级rightband，在班级里面message。有时，父母<div class="message">有一个 id subnote，有时 - 没有。代码如下：

<div class="message">
    <div class="rightband">
        <img id="img-up" src="arrow-up.png")" />
        <img id="img-down" src="arrow-down.png")" />
    </div>
</div>
<div id="subnode" class="message">
    <div class="rightband">
        <img id="img-up" src="arrow-up.png")" />
        <img id="img-down" src="arrow-down.png")" />
    </div>
</div>

在我的 CSS 中，出于特殊原因，我需要将子类rightband格式化为在悬停时更改，而不是父类。

#img-up, #img-down {
    display: none;
}
#subnode .rightband:hover #img-up {
    display: block;
}
:not(#subnode) .rightband:hover #img-down {
    display: block;
}

我.rightband:hover需要在父级中#img-up有 id=" subnode" 时显示，并#img-down在父级没有subnode.

这可以在 CSS 中完成吗？怎么做？

Answer 1

尝试类似：

#img-up, #img-down {
    display: none; 
}
.rightband:hover #img-down {
    display: block;
}
.rightband:hover #img-up {
    display: none;
}

#subnode .rightband:hover #img-up {
    display: block;
}    
#subnode .rightband:hover #img-down {
    display: none;
}