Css 我可以用同级组合符将：before或：after伪元素作为目标吗？

这个CSS不起作用有什么原因吗

a[href^=“http”]：之后{
内容：“；
宽度：10px；
高度：10px；
显示：内联块；
背景色：红色；
}
a[href^=“http”]img~：之后{
显示：无；
}

。。在这个HTML上

其思想是在匹配的锚标记上有一个伪元素。但我不希望它应用于包装图像的锚定标记。由于我不能用

a

这样的东西来定位锚，我想也许我可以通过找到它的兄弟图像来定位：after伪元素

---

任何洞察都将不胜感激。

您不能瞄准：因为它的内容没有在DOM中呈现，而且它也不会对其进行操作-要使其工作，必须重新呈现DOM，CSS不能像这样对其进行操作

检查规范以了解详细信息：

生成的内容不会改变文档树。特别是 不会反馈给文档语言处理器（例如 重做）

---

我建议您使用JavaScript来完成这项工作。

您不能使用组合器将伪元素作为相对于其生成元素以外的元素的目标

这是因为它们是伪元素，而不是实际元素，组合器只能通过在实际元素之间建立关系来工作。另一方面，伪元素只能应用于选择器的主体（最右边的复合选择器），并且只有在对真实元素进行匹配后才会发生这种情况。换句话说，首先进行匹配，就像伪元素不在那里一样，然后伪元素（如果在选择器中指示）应用于每个匹配

在代码中，选择以下选择器：

a[href^="http"] img ~ :after

a[href^="http"] img ~ *

实际上不查找

:after

伪元素，该伪元素位于

a

中

img

之后，即使这两个元素都呈现为

a

元素的子元素

可以将其改写为以下内容：

a[href^="http"] img ~ *:after

请注意

*

选择器，这是隐含的。与您可以在任何其他简单选择器之前省略

*

以使其隐含类似，从伪元素中省略

*

也使其隐含在那里。有关详细信息，请参阅

现在，即使它显示为

*：after

应该仍然匹配

a:after

（因为

a

将匹配

*

），它仍然不能这样工作。如果从选择器中删除

：after

伪元素：

a[href^="http"] img ~ :after

a[href^="http"] img ~ *

您会注意到选择器的含义完全改变：

选择任意元素
显示为

img

这是

a

的后代（其

href

以“http”开头）

由于

img

是HTML中

a

元素的最后一个子元素，因此没有要匹配的同级元素，因此不能生成

：after

伪元素

---

对于

：在
之前或
：在
伪元素之后的情况，您可能会考虑将伪元素的生成元素与伪元素的“兄弟”相匹配，但正如OP正确指出的那样，它们在那里也不走运。
关于伪元素和DOM，这是正确的。因此，它还与伪元素选择器的处理方式有关。参见my answer.CSS2语法：
：after
，CSS3语法：
：：after
。伪元素语法与此无关。这两种方法都可以。哦，我多么希望这样。我在谷歌上搜索了一个伪元素是否可以通过媒体查询作为目标。我认为使用
：last child
pseudo类将伪元素作为目标是行不通的，因为正如您所提到的，选择器，然后是伪元素？@Jacob Schneider：这是正确的。伪元素既不是其父元素的第一个、最后一个，实际上也不是第n个子元素。这些结构伪类与伪元素不匹配。