Materialize图标如何工作？

Question

使用Materilize Icon有两种方法:

1. <i class="mdi-action-settings"></i>
2. <i class="material-icons">settings</i>

<i class="mdi-action-settings"></i>我理解第一种方法是如何工作的.这适用于css定义如下:

.mdi-action-settings:before {
    content: "\e672";
}

现在我的问题是第二种方法是如何<i class="material-icons">settings</i>工作的？

以下是查看Materialise Icons的URL

Answer 1

这就是连字.看一下这个解释如何在CSS中启用它们的页面.

简而言之,如果启用它,则告诉浏览器查找应以其他方式呈现的字母组合.这里显示了一个例子.一些特殊字体(例如materializecss或您在icomoon.io中创建的字体)只使用此功能与单词来呈现图标而不是组合字母.如果浏览器无法处理连字,那么它会优雅地回退到文字,而不是空白空间.