如何在伪元素中应用Fontawesome 5的实心和空心图标

Question

6

我正在尝试在我的项目中嵌入fontawesome 5图标。我需要在伪元素（:before、:after）中添加图标。我能够添加普通图标但不能添加实心图标，因为它们具有相同的unicode值。这是目前我的css代码：

label.star:before {
  content: '\f005';
  font-family: 'Font Awesome 5 Free';
}

现在它显示的是普通星形图标。我如何使其成为实心图标？

提前致谢。

- hakkim

使用字体家族“Font Awesome 5 Solid”。 - Gerard

我已经尝试过了，但它不起作用。图标无法加载。我正在使用fontawesome的免费版本。 - hakkim

请问您能否为我们发布JS Fiddle？同时尝试使用字体：Font Awesome\ 5 Free - 参考链接：https://fontawesome.com/cheatsheet - Hiral Vadodaria

2个回答

0

我知道我来晚了，但是...

如果你需要将图标样式从实心改为常规，请更新字体系列：

font-family: 'Font Awesome 5 Free Regular';

- Ricky

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Luvias · Accepted Answer

为使它成为实心图标，请添加font-weight: 900;。

label.star:before {
    content: '\f005';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}