css:针对儿童的目标

时间:2013-03-13 10:29:08

标签: css parent target

假设我们有这个html

<div class="a">
   <div>...</div>
   ...
   <div id="b">xyz</div>
</div>


<div class="a">
   <div>...</div>
   ...
   <div id="c">abc</div>
</div>

使用css:target选择器很容易在#l上对#b进行定位时使用某种样式。 是否可以在class div上使用class =“a”来应用某些样式?

3 个答案:

答案 0 :(得分:1)

不,因为你需要一个CSS父选择器。 CSS2CSS3中没有为此指定任何内容。 CSS4确实有parent selector(称为主题选择器)使用!符号,但没有浏览器支持它(还)。

答案 1 :(得分:0)

您可以向id添加额外的<div class="a">并将其设为:

<div class="a" id="abc">

...仍然使用:target

答案 2 :(得分:0)

不,CSS 级联(CSS =层叠样式表),它不会上升。 您需要明确地将样式应用于父元素。

你最好做@otinanai建议的事情并为你的孩子div添加一个类。 e.g。

<强> HTML

<div class="a">
   <div>...</div>
   ...
   <div class="aItem" id="b">xyz</div>
</div>

<div class="a">
   <div>...</div>
   ...
   <div class="aItem" id="c">abc</div>
</div>

<强> CSS

.a {
    border: 1px solid #000;
}
.aItem {
    color: #999;
}

因此,您将使用类来一致地设置元素的样式。否则,您必须为D,E,F G到Z编写CSS,并且仅使用ID来预订/ URL目的。