html - 如何使用:before on child element?

Question

我有一个 wordpress 网站，我使用 css 来替换插件的图像(polylang 的标志)。

.lang-item-42 a img {
    content:url(/wp-content/uploads/2019/05/en.png);
}

所以这适用于 Chrome 和 Safari，但不适用于 Firefox 和 IE。正如我发现的那样，因为我应该使用 :before 选择器，但我不确定将它放在哪里，因为如果我将它放在“img”元素之后，它就不起作用。

Answer 1

首先你应该用双冒号声明::before(不是:before)因为它被认为是伪元素而不是伪类。 将此元素视为“位于元素内部和元素开头的东西”。 所以如果你想在链接中放一张图片，你可以隐藏另一个并输入

.lang-item-42 a::before {
    content:url(/wp-content/uploads/2019/05/en.png);
}

.lang-item-42 a img {
    display: none;
}

我还没有尝试过，但应该可以。