相关疑难解决方法(0)

如何根据CSS中页面中另一个元素的状态选择元素?

我有能够反映不同的状态的元件,或者由用户(触发:hover,:focus等)或由服务器操作(data-status="finished",disabled等).

我可以定位具有已更改状态的元素,但我似乎找不到基于所讨论元素的状态来定位DOM中的其他元素的方法.

例:

<section>
    <div>Element 1</div>
    <div data-status="finished">Element 2</div>
    <div>Element 3</div>
</section>
<section>
    <div>Element 4</div>
    <div class="blink">Element 5</div>
    <div>Element 4</div>
    <div>Element 4</div>
    <div class="spin">Element 4</div>
    ...
</section>
Run Code Online (Sandbox Code Playgroud)

或者只是使用服务器端的正确样式呈现元素.

是否有一个CSS选择器可以让我根据目标元素的状态指定应该选择哪些元素?

就像是:

div[data-status~=finished]:affect(.blink, .spin)
Run Code Online (Sandbox Code Playgroud)

这将允许我也只针对 CSS 没有相同父级的元素

css css-selectors css3

20
推荐指数
3
解决办法
9459
查看次数

标签 统计

css ×1

css-selectors ×1

css3 ×1