Question

我的动态数字为ul.column，其中一些有disabled类。例如：

<ul class="column"></ul>
<ul class="column"></ul>
<ul class="column disabled"></ul>

我不知道自己能拥有多少，但我想将border-right应用到不的最后.column .disabled班。

我尝试过类似的事情：

ul:not(.disabled):last-child {border-right:1px solid black}

和

ul:last-child:not(.disabled) {border-right:1px solid black}

但无论:not(.disabled)选择器如何，样式始终适用于最后一个元素。是否有其他方式来设置最后一个。column还没有.disabled类？

我使用jQuery很好，但我不知道如何实现我的目标。

Answer 1

仅使用css选择器是不可能的。你可以使用jQuery。

演示

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul class="column">
  <li>test</li>
</ul>
<ul class="column">
  <li>test</li>
</ul>
<ul class="column disabled">
  <li>test</li>
</ul>

.device .ui-accordion-header-icon {
    display: none !important;
}

Answer 2

您可以在jQuery中选择最后一个ul标记，检查它是否已禁用，并在适当时应用样式，如下所示：

if(!$('ul').last().hasClass('disabled')){
    $('ul').last().css('border-right', '1px solid black');
}

css last-child with：not selector

2 个答案:

演示