为什么文本在工具提示内容及其父级文本中都是透明的

Question

我有一个工具提示，其中包含一类.toolTip，其内容具有一类.toolTipContent。 工具提示中有两个spans 第一个span具有文本"悬停在此处"，第二个是工具提示内容。 我在.toolTip选择了第一个span，因为它是透明的，但当.toolTipContent hovering在它上面弹出时它仍然可见，但是两个spans都是透明的

演示

法典：

    .toolTip:hover > span {
         color: rgba(0,0,0,.08);
    }

Answer 1

您使用

的代码意味着 .toolTip 下的所有跨度都是透明的。如果要透明 .toolTip 下的第一个元素，请使用此

.toolTip:hover > span:first-child {
    color: rgba(0,0,0,.08);
}