1

我正在使用一堆 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;}

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

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

4

1 回答 1

2

如果您从 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 + 元素规则更具体(更强)。

于 2013-08-23T16:17:29.493 回答