您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

Font Awesome 5,为什么CSS内容没有显示?

Font Awesome 5,为什么CSS内容没有显示?

如果您使用的是 阅读以下内容:Font Awesome 5在使用JS +SVG版本时显示为空正方形

首先,您只需使用以下命令在head标签中包含Font Awesome 5的CSS文件

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">

或在CSS文件中:

@import url("https://use.fontawesome.com/releases/v5.13.0/css/all.css")

然后,您需要更正 及其 如下所示:

@import url("https://use.fontawesome.com/releases/v5.13.0/css/all.css");



.fp-prev:before {

    color:#000;

    content: '\f35a'; /* You should use \ and not /*/

    font-family: "Font Awesome 5 Free"; /* This is the correct font-family*/

    font-style: normal;

    font-weight: normal;

    text-decoration: inherit;

}


<i class="fp-prev"></i>

在某些情况下,您还必须添加

此处有更多详细信息:伪元素上的Font Awesome5显示方形而不是图标

注意:Font Awesome 5 font-family为每个图标包提供4种不同的颜色:

Font Awesome 5 Free 免费图标。

Font Awesome 5 Brands 适用于Facebook,Twitter等品牌图标。

@import url("https://use.fontawesome.com/releases/v5.13.0/css/all.css");



.fp-prev:before {

  color: #000;

  content: "\f099";

  font-family: "Font Awesome 5 Brands";

  font-style: normal;

  font-weight: normal;

  text-decoration: inherit;

}


<i class="fp-prev"></i>

Font Awesome 5 Pro对于字体真棒临

Font Awesome 5 Duotone 还包含在Pro软件包中。

CSS 2022/1/1 18:22:17 有287人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶