如果子元素存在,则覆盖父类型 [英] Override parent style if child element exists
问题描述
我想为每个包含特定类的子元素覆盖父元素 z-index
。
两个不同类别的孩子(w / c我不能改变,因为它是由API生成的)。
首先是 .pop-up
,第二个是 .label
。
两者都将被添加到 #info
下。
$ b HTML结构
< div id =info>
< div class =pop-up> ...< / div>
< / div>
< div id =info>
< div class =label> ...< / div>
< / div>
由于API操作不同, 因此,我想检查一个子元素是否存在(例如 这可能与 这是我尝试过的,但无法更新父级的 可能与CSS3。这是因为CSS3 缺少父母选择器 。 请注意, 可能会在 CSS4 ,通过 I want to overwrite parent's There are two different class of children (w/c I can't change since it's generated by API). First is a HTML Structure Due to different API actions, Thus, I wanted to check if a child element exists (eg. Is this possible with This is what I've tried, but won't be able to update the parent's
No, this is unfortunately not possible with CSS3. This is because CSS3 lacks a parent selector. It should be noted that this will become possible in CSS4, through dint of the
这篇关于如果子元素存在,则覆盖父类型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋! .label
有时会在最近渲染时放在最前面。 #info
s z-index
始终始终 110 < code $。
.label
)并将父母的 z-index
更新为 109
。
css3
?由于协议,我无法通过JS进行破解。
z-index
div#info> div.label {
z-index:109!important;
}
:has
伪类 ,您将可以目标 #info
,当它包含标签时:
div#信息:has(div.label)
z-index
for every child element containing a specific class..pop-up
and second one is a .label
.
Both will be added under #info
.<div id="info">
<div class="pop-up">...</div>
</div>
<div id="info">
<div class="label">...</div>
</div>
.label
will sometimes be on top when it gets rendered recently. #info
s z-index
is always 110
..label
) and update the parent's z-index
to 109
.css3
? I can't do a hack via JS due to an "agreement".z-index
div#info > div.label {
z-index: 109 !important;
}
:has
pseudo-class, where you would be able to target #info
when it contains a label with:div#info:has(div.label)