html - 如何在我的 CSS 中使用 fontello 的图标？

Question

我一直在使用entypo（从entypo.com下载），并显示如下图标：

.icon:before {
  display: inline-block;
  font-family: 'Entypo';
  text-decoration: none;
  speak: none;
}

.email:before {
  content: "\2709";
}

很标准。但是由于当您从 entypo.com 下载它时提示已关闭，所以我已切换到从 fontello 下载它。只是现在我的 css 内容代码不再起作用了。

我可以在演示中看到 fontello 使用这样的跨度来调用 html 中的图标：

<span class="i-code">0xe829</span>

但这对我来说似乎很丑陋。我想从 css 中完成，但我怎样才能找出在我的 css 中放入什么样的代码？

score 22 · Accepted Answer

好的，所以我发现您要做的不是使用 fontello 上提到的代码：

U+E84D
U+E854

但是将这些重写为：

\E84D
\E854

（所以删除“U+”并用“\”替换它）

像这样使用它们：

content: "\E84D";

编辑：

因此，根据要求，您将使用的完整 CSS 语法是：

.icon:before {
  display: inline-block;
  font-family: 'Entypo';
  text-decoration: none;
  speak: none;
}

.email:before {
  content: "\E84D";
}

结合以下 HTML：

<a href="#" class="icon email">Mail me</a>

1 回答 1