带有错误符号的 CSS 内容答案

【问题标题】：CSS content with wrong sybmol带有错误符号的 CSS 内容
【发布时间】：2015-05-30 07:49:26
【问题描述】：

我在里面使用 materialize.css 我找到了选择器

.mdi-navigation-arrow-drop-down:before {
  content: "\e894";
}

它应该显示箭头，但结果我得到了一个正方形。如果我将其更改为 \25BC 它可以工作。但是这个库有什么问题？我已经下载了here。

【问题讨论】：

【解决方案1】：

关于箭头，\e894 是许多字体不广泛支持的字符。

通常我会说使用 materialize 来解决这个问题，但是，我相信预期的用例是使用他们提供的字体。

【讨论】：

我想当我包含他们的css时，我已经使用了他们的字体，不是吗？
不，他们的字体是一个不同的文件，如果你不使用他们的整个系统，你需要自己包含。
下载字体文件并确保他们的 css 在 @font-face 声明中正确引用它。
@evolutionxbox 谢谢！
另外，当使用图标 content: '\e894' 时，请确保您还使用 font-family 规则包含了图标字体名称。例如：my-icon:before { content: '\e894'; font-family: 'my-icons'; }