如何在sidebar hover时为#id选择器应用CSS样式？

你之前的写法是依赖给sidebar添加sidebar-hovered类来触发样式，但这不是CSS原生的鼠标悬停触发方式，正确应该用:hover伪类来实现。

两种正确写法： #

• 如果#span_logout是.sidebar的直接子元素：

#span_logout {
  display: none;
}

.sidebar:hover > #span_logout {
  display: block;
}

• 如果#span_logout是.sidebar的任意后代元素（不管嵌套层级）：

#span_logout {
  display: none;
}

.sidebar:hover #span_logout {
  display: block;
}

补充说明： #

不需要加!important，因为.sidebar:hover #span_logout的选择器权重（10 + 1 + 100 = 111）高于单独的#span_logout（100），足够覆盖初始样式。

内容的提问来源于stack exchange，提问作者Dzzo