使用带有 Angular 字体的 CSS 伪元素真棒问题

Question

我已将 @fortawesome/angular-fontawesome - 从这里 - https://www.npmjs.com/package/@fortawesome/angular-fontawesome 安装到我的 Angular 7 应用程序中。

我可以使用图标，但我找不到通过 CSS 添加它们的方法。

我正在尝试添加这样的 ico CSS 伪元素：

.test:before {
    font-family: "Font Awesome 5 Free";
    content: "\f75b";
    display: inline-block;
    padding-right: 3px;
    vertical-align: middle;
    font-weight: 900;
 }

这不起作用。我所看到的只是一个空旷的广场。有人知道如何通过 CSS 伪元素使用图标吗？

Answer 1

我没有找到一种方法使用 angular-font-awesome 包来将它与 css 或 .scss 中的伪元素一起使用。

我发现的唯一方法是： [将下一个代码粘贴到您的 styles.css 或 styles.scss 文件的顶部]

@font-face {
    font-family: 'FontAwesome';
    font-style: normal;
    font-weight: normal;
    src: url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0");
    src: url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"), url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0") format("woff2"), url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0") format("woff"), url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0") format("truetype"), url("http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");}

我知道我要再次导入 font awesome，但我希望这种不实用的方法对你有所帮助。

Answer 2

使用字体系列：“FontAwesome”；