css - 选择另一个元素内的第一个元素

Question

我正在尝试选择这组中的第一个和最后一个按钮:

<ul>
  <li>
    <button>stuff</button>
  </li>
  <li>
    <button>stuff</button>
  </li>
  <li>
    <button>stuff</button>
  </li>
</ul>

这可以用 CSS 完成吗？我正在尝试使用 :first-of-type 和 :first-child 但它们不起作用。

Answer 1

一种方式:

ul li:first-child button {
    margin: 10px;
}

ul li:last-child button {
    margin: 10px;
}