Question

我遇到了创建css（sass）选择器的问题，它选择了列表中的类的最后一个元素（ WITHOUT JAVASCRIPT ）：

<ul>
  <li class="post pinned">1</li>
  <li class="post pinned">2</li>
  <li class="post">3</li>
  <li class="post">4</li>
</ul>

需要选择带有固定类的最后一个帖子（即2）。

fiddle

Answer 1

<强>问题：

实际上:last-child无法正常工作，因为它只会选择容器的最后一个子节点，无论它有什么类，last-of-type不能正常工作，因为它只选择了来自容器的具有特定类型的最后一个元素。

<强>替代：

所以基本上最好的解决方案是为这样的元素使用专用类：

＆＃13;

.micropost {} .micropost.pinned {
  color: red;
}
.micropost:last-child {
  color: green;
}
.lastPinned {
  background-color: green;
}

＆＃13;

<ul>
  <li class="micropost pinned">1</li>
  <li class="micropost pinned lastPinned">2</li>
  <li class="micropost">3</li>
  <li class="micropost">4</li>
  <li class="micropost">5</li>
  <li class="micropost">6</li>
  <li class="micropost">7</li>
</ul>

＆＃13;

Css：用class添加样式到最后一个元素（没有js）

1 个答案: