css - 图标字体不显示某些图标

Question

我有自己的图标字体，所以上面有 10 个图标。主要问题如下。 其中 8 个在网站上显示良好，但其中 2 个显示为我给他们的字母('f' 和 'e')

例如，这是我插入图标的方式

.test-icon-user1:before {content: "\61";}
.test-icon-user2:before {content: "\62";}
.test-icon-user3:before {content: "\63";}
.test-icon-user4:before {content: "\64";}
.test-icon-user5:before {content: "\65";}
.test-icon-user6:before {content: "\66";}
.test-icon-user7:before {content: "\67";}

其中只有 2 个不起作用...这很奇怪，因为我插入它们的方式相同，样式表加载正常，一切看起来都很好。

这是它的样子。

这是我通过html插入的方式(名称与原始名称不完全相同，所以我检查了任何可能的拼写错误)

<a id="sticky-login-toggle" class="test-icon-user1 sticky-toggle"></a>

最后是我如何插入图标字体

@font-face {
  font-family: "test";
  src:url("fonts/test.eot");
  src:url("fonts/test.eot?#iefix") format("embedded-opentype"),
    url("fonts/test.woff") format("woff"),
    url("fonts/test.ttf") format("truetype"),
    url("fonts/test.svg#test") format("svg");
  font-weight: normal;
  font-style: normal;

}

[class^="icon-"]:before,
[class*=" test-icon-"]:before {
  font-family: "test" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

Answer 1

答案在这里。

FontAwesome icons not showing. Why?

codepen 仍然是 actvia。您可以将您的代码粘贴到那里，看看是否有效

http://codepen.io/TheNathanG/pen/xbyFg

我有自己的图标字体，所以上面有 10 个图标。主要问题如下。其中 8 个在网站上显示良好，但其中 2 个显示为我给他们的字母('f' 和 'e')

例如，这是我插入图标的方式

.test-icon-user1:before {content: "\61";}
.test-icon-user2:before {content: "\62";}
.test-icon-user3:before {content: "\63";}
.test-icon-user4:before {content: "\64";}
.test-icon-user5:before {content: "\65";}
.test-icon-user6:before {content: "\66";}
.test-icon-user7:before {content: "\67";}