Question

我在应用:last-of-type和:before时遇到问题。

我有以下内容：

.stepwizard-row:before {
  position: absolute;
  top: 0px;
  content: " ";
  width: 1px;
  height: 100%;
  background-color: #97D3FD;
}
.stepwizard-row:before:last-of-type {
  position: absolute;
  top: 0px;
  content: " ";
}

但是，:before:last-of-type似乎没有任何效果。

我做错了什么？

Answer 1

订单错误，应该是：

.stepwizard-row:last-of-type:before {}

<强> CSS3 Selectors - 7. Pseudo-elements

每个选择器只能显示一个伪元素，如果存在，则必须在表示选择器主题的简单选择器序列后出现。 注意：此规范的未来版本可能允许每个选择器使用多个伪元素。

顺便说一下，使用.class:last-of-type可能会出现意外行为，确实应该使用元素，例如.parent > div:last-of-type。

<强> 6.6.5.9. :last-of-type pseudo-class

与:nth-last-of-type(1)相同。 :last-of-type伪类表示一个元素，该元素是其父元素子元素列表中其类型的最后一个兄弟。

CSS：last-of-type和：before not not working

1 个答案: