CSS内容在某些情况下无效

Question

我想在内容之前加入CSS。 我想把信息图标（i），即“\ e608”

#securityCodeLink:before {
    content: "\e608";
}

输出看起来像这样

但是，如果我尝试使用2701或类似的东西

#securityCodeLink:before {
    content: "\2701";
}

它完美无缺。

任何人都可以告诉我这是为什么以及如何解决这个问题？

Answer 1

只有在您使用支持它的字体时才会显示图标。

在StackOverflow上（使用font-family的{​​{1}}）：

Arial, 'Liberation Sans', 'DejaVu Sans'呈现为

\e608呈现为ઍ

Answer 2

我对此进行了很多研究，最后得到了解决方案..

只有在您使用支持它的特定字体时才会显示图标。 在CSS中，我们需要定义如下的字体。

@font-face{
font-famiy:'nameOfFont';
src: url(data:application/font-woff;charset=utf-8;base64______format("woff");
}

.requiredFont input[type=radio]{
    font-family: nameOfFont;
    display: inline-block;
    text-decoration: inherit;
}
 .requiredFont input[type=radio]{
    content: "\E608";
}

.requiredFont input[type=radio]:checked {
    content: "\E609";
    color: reqired HEX Color;
}

最可能它会工作......当我们设计我们想要的单选按钮内容的字体时..