我有一个非常基本的问题,我现在试图解决一段时间。我的所有想法都用完了。
之前我有一个css伪元素,我就像这样造型。
#fPhone::before{
color: #78be20;
content: "\e622";
font-family: icons;
}
但是在浏览器上它只打印出622.当我检查伪标签时,我看到了
content: "e622";
如果我尝试添加" \"在调试器中它可以工作但由于某种原因它不能从css中获取它。
我没有可能导致这种情况的原因。
答案 0 :(得分:0)
确定您正确导入了图标字体并使用了正确的十六进制代码?以下证明它可以正常运作......
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
#fPhone::before{
color: #78be20;
content: "\e0cd"; /* different code, but same effect */
font-family: 'Material Icons';
}
/* class is pre-defined in @import (default <parent>color, 24px)*/
.material-icons { color: #78be20; font-size: 16px; }
/*
find the codes and ligatures for Material Icons at:
https://github.com/google/material-design-icons/blob/master/iconfont/codepoints
*/
&#13;
<div id="fPhone"> a phone</div>
<div><i class="material-icons">phone</i> using ligature name</div>
&#13;