gpt4 book ai didi

css - 如何将样式应用于基于祖先 div 的后代 div?

转载 作者:行者123 更新时间:2023-11-28 15:56:39 24 4
gpt4 key购买 nike

假设下面的 html 结构,我需要根据具有类 ancestor-module 的祖先的存在来覆盖 app-dropdown__trigger__icon 类中的样式。我正在使用 ember,所以 app-dropdown__trigger__iconancestor-module 位于不同的模块中,即我无法轻易地从 child 的 scss 中引用祖先。有没有办法实现基于祖先类的条件样式?

<td id="ember1249" class="lt-cell align-center ember-view">
<div id="ember1254" class="ember-view">
<div class="ancestor-module">
<div id="ember1259" class="ember-view">
<div id="ember1264" class="__app-dropdown__aa494 ember-view">
<div id="ember1274" aria-owns="ember-basic-dropdown-content-ember1269" tabindex="0" data-ebd-id="ember1269-trigger" role="button" class="app-dropdown__trigger ember-basic-dropdown-trigger ember-view">
<span class="app-dropdown__trigger__icon">
<i id="ember1275" aria-hidden="true" class="fa fa-house ember-view"></i>
</span>
</div>
<div id="ember-basic-dropdown-content-ember1269" class="ember-basic-dropdown-content-placeholder" style="display: none;"></div>
</div>
</div>
</div>
</div>
</td>

最佳答案

我不知道 ember.js 对此有何影响,但在普通 CSS 中,我会这样做:

.app-dropdown__trigger__icon {
color: green;
}

.ancestor-module .app-dropdown__trigger__icon {
color: red;
}

据我所知,SCSS 不会影响此解决方案。

关于css - 如何将样式应用于基于祖先 div 的后代 div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51273269/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com