html - 移动浏览器中带有 before 选择器的 CSS 内容不显示

Question

我使用 ::before 选择器在网站标题前添加了一个内容。内容可以在桌面浏览器中看到/显示，但不能在移动浏览器中看到/显示(至少在谷歌浏览器和我的 Android 智能手机上的默认浏览器中)。为什么会发生这种情况以及如何解决？

.site-title a::before {
    color: firebrick;
    content: "Ψ ";
}

讨论的网站是psihoterapeut.md

Answer 1

我会改用 Unicode 字符:03a8(希腊大写字母 PSI)或 03c8(希腊小写字母 PSI)

问题看起来像字体，您正在使用 cursive，请尝试删除该字体。

div::before {
 color: firebrick;
 content: "\03a8"
}

<div>test</div>