Html 字体名称:；统一码

我在我的网站上使用了非常棒的字体，如果我这样使用的话，效果很好：

<i class="icon-home"></i>

但是（出于某些原因），我想以Unicode的方式使用它，比如：

<i>&#xf015;</i>

&xf015；

（）

但它不起作用——浏览器显示的是一个正方形

我如何解决这个问题？ CSS路径是正确的（作为使用字体的第一种方式）

---

编辑：我确实安装了FontAwesome.otf。

在阅读了davidhund的答案后，我想出了一个解决方案，您的web字体没有正确加载，这可能是一个错误路径的问题

他是这么说的：

我的第一个猜测是，您包含了来自 不同的（子）域。因此，请确保在上设置了正确的标题 那些webfont文件：“您需要添加 Access Control Allow Origin标头，将您要访问的域列为白名单 从中提取资产。”

再看看：）

希望我很清楚并帮助了你：）

在同一页上，f135ta说：

…我通过上传文件“FontWoome webfont.ttf”解决了这个问题 安装到我的Web服务器，并将其作为常规字体安装。。我不知道 它是使用它的一部分，但它对我来说是有效的-

---

它不工作，因为

和#xf015

只要求浏览器使用斜体显示专用代码点U+F015。字体可怕的CSS代码没有任何会影响这一点。如果将

class=icon home

添加到标记中，您将在FontAweasome字体中获得分配给U+F015的字形，但由于FontAweasome诡计的工作方式，您将获得两次

为了只获得一次字形，您需要使用CSS来请求使用字体，而不触发通过生成的内容添加字形的规则。一个简单的技巧是使用一个以

图标-

开头的类名，但不匹配Font-awome中的任何预定义名称或CSS或JavaScript代码中使用的任何名称。例如：

<i class=icon-foo>&#xf015;</i>

&xf015；

或者，使用CSS代码在

i

元素上设置

font-family:FontAwesome

和

font-style:normal

---

注意，根据定义，私用代码点（如U+F015）没有可互操作的含义。因此，当禁用样式表时，

将不会显示为任何字符；浏览器将使用它的方式来传达未定义数据的存在，例如一个可能包含代码点编号的小方框。
仅添加上面的Jukka K.Korpela答案，font awesome已经定义了一个css选择器“fa”。您只需执行
。这里需要注意的是，fa定义了字体样式：normal，如果需要斜体，可以像

您必须使用
fa
类：

<i class="fa">
   &#xf000;
</i>

<i class="fa fa-2x">
   &#xf000;
</i>


；
；
对于那些可能偶然发现此帖子的人，您需要设置

font-family: FontAwesome; 

作为CSS选择器中的一个属性，然后unicode将在CSS中正常工作，您还可以将FontAwesome图标与CSS3伪选择器一起使用，如下所示。

确保将字体系列设置为FontAwesome，如下所示：

table.dataTable thead th.sorting:after {font-family: FontAwesome;}

要使上述功能正常工作，必须执行以下操作：

在这里下载css库
从zip文件中提取并包含到应用程序根文件夹中，这两个文件夹如下所示：

仅参考应用程序
部分中的css文件夹，如下所示：

我发现这很有效

content: "\f2d7" !important;
font-family: FontAwesome !important;

它似乎不工作，没有这个！对我来说很重要

这里有一个关于如何使用Unicodes更改社交图标的教程
我发现在Font Awest version 5（免费）中，您添加了：
“font-family:font-Awesome\5 Free；”只有这样它才能正常工作

这对我很有用：）

我希望有些人会觉得这很有帮助
我在使用unicode和Fontsome时遇到了一个类似的问题。
当我写道：

font-family: 'Font Awesome\ 5 Free';
content: "\f061"; /* FontAwesome Unicode */

在google chrome上，会出现一个正方形而不是图标。
新版本的Font Asome还需要

font-weight: 900;

这是我的工作

发件人：

希望这会有所帮助。
一定要先加载FontAwesome样式

font-family: "Font Awesome 5 Free";
font-weight: 400;
content: "\f007";

你可以在这里找到Fontsome的解释：
请记住，您可能还需要包括一个版本号，因为您可以使用：

font-family: 'Font Awesome 5 Pro';

或

据我所知，有三种不同的字体系列可供选择，每种字体都有自己需要应用的权重元素：

首先

font系列：'font-Awesome 5品牌'；
内容：“\f373”

第二

字体系列：'font Awesome 5 Free'；
内容：“\f061”；
字号：900

第三

字体系列：'font Awesome 5 Pro'

此处的参考-

希望这能有所帮助。
在最新的5.13版本中有一点不同。
你总是喜欢

font-family: "Font Awesome 5 Free";
content: "\f107";

但是现在有了不同。。。而不是使用字体重量：500；您正在执行以下操作：

font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f107";

为什么呢？我是通过在.fas类中查找来了解的，所以您可以通过查看.fas类来了解更新的方法，所以您也必须这样做。确定是否存在字体大小和字体系列。给你们，伙计们。这是5.13的更新答案。
使用css，您可以通过Unicode添加图标

content: '\f144';
font-family: FontAwesome;

这将适用于那些使用Font Awesome 4.7版的用户

css_selector::before{
content:"\f006";
font-family:"fontawesome";
font-weight:900;
}

增加字体重量900.这对我有用

font-weight: 900;

请发布一个jsfiddle:jsfiddle.netI我现在无法访问所有文件，我只想知道如何使用unicode的web字体。请尝试在您的页面上设置：
。不能，因为我的网站仍然是本地的，只是一些html。我甚至不需要使用WAMP/XAMPP来检查它。字体是本地安装的，那么路径呢？他们说得对吗？仔细检查他们！它们必须是正确的，因为当我以这种方式使用字体时，它
font-weight: 900;