我正在使用Font Awesome，但不希望使用HTTP添加CSS。我已下载Font Awesome并将其包含在我的代码中，但是它显示为一个带边框的方框而不是一个图标。以下是我的代码：
<html>
<head>
<link rel="stylesheet" href="../css/font-awesome.css">
<link rel="stylesheet" href="../css/font-awesome.min.css">
</head>
<body>
<div style="font-size: 44px;">
<i class="fa fa-camera-retro fa-lg"></i> fa-lg
<i class="fa fa-camera-retro fa-2x"></i> fa-2x
</div>
</body>
</html>
我想知道如何让图标显示而不是边框方框。
以上都是正确的，但我的问题是我下载了免费版本的FA5，它没有：
font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.eot?v=4.7.0')
我无法使v5正常工作，因此在参考上述帖子的帮助下，我回退到了4.7.0版本并解决了我的问题。
首先，你不应该同时使用font-awesome.css和font-awesome.min.css
通常，在开发过程中使用font-awesome.css，然后在网站完成后切换到font-awesome.min.css
此类问题通常是由于相对路径和位置引起的，请检查您的HTML文件与CSS文件的位置关系。
如果您的HTML文件位于基本目录中，而CSS文件在根目录的子文件夹中，则需要：
href="./css/font-awesome.css"（只需一个点）
如果您正在使用SCSS和NPM软件包，这是我的解决方案：
npm i --save @fortawesome/fontawesome-free
然后在SCSS文件的顶部（最好是在应用程序根目录导入的SCSS文件）：
@import '@fortawesome/fontawesome-free/css/fontawesome.css';
@import '@fortawesome/fontawesome-free/css/all.css';
@fortawesome/fontawesome-free/css/all.css 就解决了。 - Andy Braham<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/js/all.js" integrity="sha256-2JRzNxMJiS0aHOJjG+liqsEOuBb6++9cY4dSOyiijX4=" crossorigin="anonymous"></script>在我的情况下，我需要将sst和Bruno Leveque的答案结合起来：
Django示例：
# in myapplication/vendor/fontawesome/ everything unpacked
<link rel="stylesheet" href="{% static 'myapplication/vendor/fontawesome/css/all.min.css' %}">
<a class="nav-link fa fa-instagram" style="font-family:FontAwesome;" href="//www.instagram.com/xxxx/" target="_blank"></a>
<a class="nav-link" href="//www.instagram.com/xxxx/" target="_blank"><i class="fab fa-instagram"></i></a>
在我的情况下，只需要添加字体族名称即可，例如当我需要添加Instagram图标时，我需要将字体族名称设置为FontAwsome：
.fa-instagram:before {
content: "\f16d";
font-family: "FontAwesome" !important;
}
far）导致的。更改为fas即可解决问题。
而css文件夹就像这样
而字体文件夹则如下：
我希望它对你有用。
谢谢你。