css - 如何选择父元素的第一个和最后一个子元素？

Question

我如何选择这个的第一个和最后一个 child 。所以 <ul>最后<p>被选中了吗？

<blockquote>
  <ul></ul>
  <p></p>
  <p></p>
  <p></p>
</blockquote>

我认为这会起作用:

blockquote:first-child {...}
blockquote:last-child {...}

但这只是选择了 blockquote元素？谢谢。

Answer 1

您需要使用后代组合器(blockquote 和 :first-child 伪类之间的空格:

blockquote :first-child {...}
blockquote :last-child {...}

JS Fiddle demo .

如所写，您的选择器正在选择 blockquote，它本身就是 :first-child，和 blockquote 本身就是其父元素的 :last-child。

引用资料:

• > CSS Selectors .