font-awesome图标的显示问题

Posted ky-thompson23

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了font-awesome图标的显示问题相关的知识,希望对你有一定的参考价值。

font-awesome一个很强大的字体图标库。
下载链接:http://fontawesome.dashgame.com/
刚开始使用font-awesome的新手往往容易只引入一个css文件,这样就会导致图标显示不出来。如下图:

 

 技术图片

 

 下载解压后我们至少需要引入这两个文件夹css、fonts,)这两个文件夹必须同级(其他两个文件夹暂时没用到过),不然就会出现图标显示不出来,建议解压出来的整个文件丢到项目里(不大)

技术图片

 

 页面引用:

技术图片

 

 代码:

<link rel="stylesheet" href="日本体检_files/font-awesome/css/font-awesome.css">

引用成功后效果图:

技术图片

 

以上是关于font-awesome图标的显示问题的主要内容,如果未能解决你的问题,请参考以下文章

为啥nginx环境下bootstrap中font-awesome图标显示不出来

WPF —— 使用Font-Awesome图标字体

为啥我的图标显示为空白方块?

Laravel 7 不显示真棒字体图标

用 font-awesome 将小图标堆叠在大图标上

尝试将 Font-Awesome 图标添加到我的导航栏中的选项卡