在当前时刻,有一种能够找到一个元素,然后后跟另一个特定元素没有CSS方式。
可能很快,会有CSS关系伪类:has()
这将使你想要的可能。这目前在CSS Selectors Level 4 Draft,并且看起来不太可能在任何浏览器上很快推出。
一个演示在下面,但不要指望它能工作,直到选择器4草案至少在工作草案中。
请留意CanIUse以查看它何时可用。
ul li:has(+ .hidden:last-child),
ul li:last-child:not(.hidden) {
background: red;
}
<ul>
<li>
<button>1</button>
</li>
<li>
<button>2</button>
</li>
<li class="hidden">
<button>3</button>
</li>
</ul>
:has()
可jQuery中的,所以这里是一个jQuery替代
Read more here from the Official jQuery Docs
$('ul li:has(+ .hidden:last-child), ul li:not(.hidden):last-child').css('background', 'red');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li>
<button>1</button>
</li>
<li>
<button>2</button>
</li>
<li class="hidden">
<button>3</button>
</li>
</ul>
你想在你的榜样,选择第二李? – 3rdthemagical
这是不可能的。 – 3rdthemagical
我弄错他究竟想要什么? –