Question

我正在使用一堆div（用PHP创建）来生成一个可点击元素块。我需要做的是将一些样式应用于这些泛型元素，而不是特定的元素，但使用下面的代码似乎是无效的。

#Container {
height: 80%;
width: 60%;
background-color: green;
}
#Container div:hover {
background-color: blue;
}

<div id="Container">
  <div style="background-color: red; width: 100px; height: 100px;">    
</div>

http://jsfiddle.net/XD2eZ/

所以我不确定是否存在泛型div元素不能被设置为子元素并且具有正确操作的：hover属性的问题。我知道可以指定类或id来处理这个问题，但是有数千个独特的div。我也不能用

#Container:hover div{ background-color: blue;}

因为它似乎也是无效的，但我需要从一个块中选择一个元素，而不是一次全部。

这里有什么想法吗？提前谢谢。

Answer 1

如果您从HTML中删除背景颜色，并使用css：

应用它，这将有效

#Container {
    height: 80%;
    width: 60%;
    background-color: green;
}
#Container div {background-color: red;}

#Container div:hover {
    background-color: blue;
}

示例：http://jsfiddle.net/XD2eZ/1/

reasone是CSS Specificity - style属性规则比ID +元素规则更具体（更强）。

可以：悬停应用于父div的特定通用元素标签吗？

1 个答案: