Css 为什么firefox会给某些字符着色，是否有解决方法？

我正在写css的时候偶然发现了这个奇怪的“东西”。我有以下css：

div:after {
    content: '✔';
    color: red;
}

它没有显示红色的复选标记，而是显示了绿色的复选标记。这只发生在Firefox中。这是某种bug还是应该是“预期”结果。我发现了一个包含多个字符的列表，firefox将其转换为自定义的“图标”。您可以在此处找到列表：

我还制作了一张图片，展示了Firefox和Chrome的区别。

更新：

基于@LinkinTED提供的JSFIDLE的屏幕截图

---

当我使用直接十六进制代码时，对我来说很好

div:after {
content: '✔';
color: #ff0000;
}

---

出现上述行为是因为这些特定字符的回退字体加载不正确。 首先，它加载

Segoe用户界面表情符号

，如果不存在，它将加载

Segoe用户界面符号

。SegoeUIEmoji字体（在Windows8中）是预先设置的，这使得不可能使用CSS设置样式。考虑到这一点，解决方案很简单，只需使用正确的字体（

Segoe UI-Symbol

）

检查这个新提琴，看看这个解决方案在起作用。

资料来源：

---

在这里似乎工作得很好，FF24