Question

这是我的小提琴，我想知道为什么这不起作用？我希望最后一个.checked元素为红色，我无法理解发生了什么。

好的，在阅读了一下之后，我发现:last-of-type对类不起作用。所以，我的问题是，我怎么能这样做？试图获得纯CSS解决方案，而不是JS解决方案。（我认为我可以自己使用JS）。

 .checked {
   color: blue;
 }
 .checked:last-of-type {
   background: red;
 }

<ul class="select-it-list">
  <li data-order="1" data-value="AX" class="checked" style="display: list-item;">
    <input type="checkbox">Åland Islands</li>
  <li data-order="4" data-value="AS" class="checked" style="display: list-item;">
    <input type="checkbox">American Samoa</li>
  <li data-order="0" data-value="AF">
    <input type="checkbox">Afghanistan</li>
  <li data-order="1" data-value="AX" class="checked-hidden" style="display: none;">
    <input type="checkbox">Åland Islands</li>
  <li data-order="2" data-value="AL">
    <input type="checkbox">Albania</li>
  <li data-order="3" data-value="DZ">
    <input type="checkbox">Algeria</li>
  <li data-order="4" data-value="AS" class="checked-hidden" style="display: none;">
    <input type="checkbox">American Samoa</li>
  <li data-order="5" data-value="AD" class="" style="display: list-item;">
    <input type="checkbox">Andorra</li>
  <li data-order="6" data-value="AO">
    <input type="checkbox">Angola</li>
  <li data-order="7" data-value="AI">
    <input type="checkbox">Anguilla</li>
</ul>

：last-of-type无法正常工作

0 个答案: