5

如果我只想在链接后面跟着另一个元素时才在链接之后插入一个伪元素，比如 ul。我怎么能这样做？

例子：

<ul>
    <li>
        <a href="#">blah<!-- insert -> here with CSS --></a>
        <ul>
            <li>More stuff</li>
        </ul>
    </li>
    <li>
        <a href="#">blah 2<!--Do nothing here--></a>
    </li>
</ul>

我希望发生的 CSS：

ul li a:after if(next:ul) {
   content:"->";
}

我不想使用 JavaScript/jQuery。而且我意识到条件是否不属于css。有没有办法做到这一点？

4

3 回答 3

9

一般来说，不可能根据下一个兄弟元素来选择元素。

在您的特定情况下，您可以使用ul li a:not(:last-child)::after，因为碰巧您的锚点后面没有<ul>元素也是最后一个子元素。

于 2013-10-18T16:06:03.590 回答
2

您可以简单地使用：

ul + li a:after {  /* ...css code... */  }

基本上这意味着：

匹配一个a元素中包含的li元素，该元素紧跟在一个ul元素之前。

CSS 中的+运算符称为相邻兄弟组合器。

于 2013-10-18T15:45:52.273 回答
0

如果要过滤元素中的任何元素，hierarchy/list可以使用以下方法。

ul li a:not(:nth-last-child(N))::after

这N是从末尾遍历的任何正整数；1表示最后一个元素2表示倒数第二个，依此类推。而不是在ul li这里使用任何选择器

有关更多信息，请访问nth-last-child()。

于 2020-12-05T15:56:16.950 回答