php - :hover 可以应用于特定于父 div 的通用元素标签吗？

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/

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