html - 我怎么能使用伪元素 :after :before conditionally

Question

如果我想仅在链接后跟另一个元素(比如 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。有办法做到这一点吗？

Answer 1

通常不可能根据元素的下一个兄弟来选择元素。

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