2

我正在申请:last-of-type一个应该是这样的元素。在http://www.elemovements.com上查看最终div.info（即每篇文章的底部信息）。为什么它不起作用？

4

3 回答 3

14

伪类:nth-of-type()家族只看元素的类型，即它的标签名。它们不会按您的类选择器或任何其他选择器进行过滤。

因此，您的陈述：

我正在申请:last-of-type一个显然是这样的元素。看看决赛div.info

是矛盾的。在那之后有一个div.center，使它成为最后一个，而不是你的。divdiv.info

你目前不能使用 CSS 选择器来找到你的最后一个div.info；您将不得不求助于添加额外的类和/或使用 JavaScript。

于 2012-04-20T21:13:40.883 回答
2

您对 CSS 有最常见的误解之一。CSS 不是从左到右读的，而是从右到左读的！

意思是，浏览器会寻找div.info:last-of-type，所以浏览器会按以下顺序过滤元素：

  1. 每种类型的最后一个元素（标签名称）
  2. 有类info
  3. 是一个div。

您的元素不按该顺序满足这些条件。它可能是最后一个带有信息类的 div，但没有最后一个元素有一个类info

于 2012-04-20T21:08:18.800 回答
0

这2个是一样的：

div.info:last-of-type

div:last-of-type.info

:last-of-type是击中，而div不是.info，并且.info将找到的结果限制为0。

另一个例子：

.section.section-test:last-of-type

实际上会像：.section:last-of-type.section-test

于 2015-11-30T14:32:01.467 回答