如何在CSS中插入图标​​？

Question

我尝试使用以下代码在css中插入图标​​：

content: "\f103";

但这不起作用。

如果我添加以下行，它将不起作用：

font-family: FontAwesome;

我想按照以下示例中的操作，将产品添加到购物车并转到订单：

https://demo.commercekickstart.com

Answer 1

您应该在CSS文件中使用fontAwesome并添加以下内容：

font-family: FontAwesome;

Answer 2

这是怎么回事：

您正在尝试将Unicode字符U+F103插入页面。此字符是“专用区Unicode”子集的一部分。这是Unicode承诺不会映射任何字符的字符范围，以便图标字体和应用程序可以使用这些值。

您看到的大多数图标将具有unicode值，例如content: "\f103";和图标字体，例如FontAwesome。

如果要包括图标字体，则还需要在网站中导入该字体。 对于FontAwesome，可以通过在HTML文档的开头添加<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">来跟随它们的“ How To Use”。

完成此操作后，您可以找到所需的图标，例如info circle，然后单击顶部的复制选项之一。

如果您复制他们的html，请像<i class="fas fa-info-circle"></i>一样将其放在页面上。 .fas为您设置字体系列，.fa-info-circle设置适当的unicode符号。