blocks|key|2554022|text|让我们将all.min.css添加到css目录中，然后链接它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2554023|<link+rel="stylesheet"+href="/css/all.min.css">|code-block|syntax|javascript|2554024|并在所有主文件夹旁边创建webfonts目录。|2554025|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

lets add all.min.css to css directory then link it

<pre><code>&lt;link rel="stylesheet" href="/css/all.min.css"&gt;
</code></pre>

and make webfonts directory beside all the main folders

blocks|key|2553895|text|您可以使用cdn链接的方阵，这是一个更好的方式。请看下面的代码，它可能对你有帮助|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2553896|​|2553897|<link+href="https://use.fontawesome.com/releases/v5.0.4/css/all.css"+rel="stylesheet">
<i+class="fa+fa-camera-retro+fa-10x"+>|code-block|syntax|javascript|2553898|2553899|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

You can use cdn link for fontawsome,its a better way. Please see the below code, it may help you

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://use.fontawesome.com/releases/v5.0.4/css/all.css" rel="stylesheet"&gt;
&lt;i class="fa fa-camera-retro fa-10x" &gt;&lt;/i&gt;</code></pre>
</div>
</div>

blocks|key|1137594|text|尝试通过在导入方法的开头添加另一个/来使用绝对路径。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1137595|您确定只需要导入小型化的css吗？您可能也需要导入字体。|1137596|控制台上的错误显示您所面临的问题与导入相关。|1137597|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|H|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|I|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|J|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|G|$]]

Try to use the absolute path by adding another / in the start of your import methods.

Are you sure that you only need to import the minified css? You might need to import the fonts too.

The error on your console shows that the problem you're facing is import related.

blocks|key|2553935|text|我看到你是从/fontawesome那里得到的。然后FA将尝试从/webfonts加载它的字体--我假设它不存在。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2553936|我建议坚持FA的文件夹结构。将.CSS移动到/fontawesome/css，并确保将webfonts-with-css/webfonts-folder复制到/fontawesome/webfonts中。|2553937|entityMap^0|6|C|W|9|0|M|G|17|Q|27|L|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]|$9|M|A|N|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]|$9|T|A|U|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|I|$]]

I see that you're getting the .CSS from <code>/fontawesome</code>. FA will then try to load its fonts from <code>/webfonts</code> - I assume this does not exist.

I'd recommend to stick with FA's folder-structure. Move the .CSS to <code>/fontawesome/css</code> and make sure you copy the <code>webfonts-with-css/webfonts</code>-folder into <code>/fontawesome/webfonts</code>.

blocks|key|2553950|text|我也有同样的问题。我有一个名为fontawesome的目录，我将fontawesall.css和webfonts目录放入其中。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2553951|我只是通过添加子目录css、将.css文件移动到它并更改链接以包含子目录来将其更改为放置目录结构。|2553952|现在工作得很好。|2553953|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|H|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|I|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|J|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|G|$]]

I had the same problem. I had a directory called fontawesome into which I put fontawesome-all.css and the webfonts directory.

I simply changed it to placing the directory structure by adding a subdirectory css, moving the .css file to it and changing the link to include the subdirectory.

Works perfectly now.

blocks|key|91057|text|一个简单的解决方案。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|91058|从#fontawesome下载文件|ordered-list-item|91059|​|91060|📷|atomic|offset|length|91061|91062|你的html|91063|91064|91065|91066|你的浏览器屏幕|91067|91068|91069|91070|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://developer.qcloudimg.com/http-save/yehe-900000/d7e4d3cea19b4a3e186970ff70777bfc.png|imageAlt|1|https://developer.qcloudimg.com/http-save/yehe-900000/cd3be871d6eeeb1d19afd88c5d748d90.png|2|https://developer.qcloudimg.com/http-save/yehe-900000/0cd17bbf43b0125b9cbcbfd492b25db1.png^0|0|0|0|0|1|0|0|0|0|0|0|1|1|0|0|0|0|0|1|2|0|0^^$0|@$1|2|3|4|5|6|7|19|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|1A|8|@]|9|@]|A|$]]|$1|E|3|F|5|6|7|1B|8|@]|9|@]|A|$]]|$1|G|3|H|5|I|7|1C|8|@]|9|@$J|1D|K|1E|1|1F]]|A|$]]|$1|L|3|F|5|6|7|1G|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|1H|8|@]|9|@]|A|$]]|$1|O|3|F|5|6|7|1I|8|@]|9|@]|A|$]]|$1|P|3|H|5|I|7|1J|8|@]|9|@$J|1K|K|1L|1|1M]]|A|$]]|$1|Q|3|F|5|6|7|1N|8|@]|9|@]|A|$]]|$1|R|3|S|5|D|7|1O|8|@]|9|@]|A|$]]|$1|T|3|F|5|6|7|1P|8|@]|9|@]|A|$]]|$1|U|3|H|5|I|7|1Q|8|@]|9|@$J|1R|K|1S|1|1T]]|A|$]]|$1|V|3|F|5|6|7|1U|8|@]|9|@]|A|$]]|$1|W|3|-4|5|6|7|1V|8|@]|9|@]|A|$]]]|X|$Y|$5|Z|10|11|A|$12|13|14|-4]]|15|$5|Z|10|11|A|$12|16|14|-4]]|17|$5|Z|10|11|A|$12|18|14|-4]]]]

An simple solution.

<ol>
<li>Download the files from #fontawesome for #web</li>
</ol>

<img src="https://i.stack.imgur.com/SBipL.png" alt="Download the files from #fontawesome for #web">

<ol start="2">
<li>Your html</li>
</ol>

<img src="https://i.stack.imgur.com/agbSi.png" alt="Your html">

<ol start="3">
<li>Your browser screen</li>
</ol>

<img src="https://i.stack.imgur.com/4dRf0.png" alt="Your browser screen">

blocks|key|2553856|text|这是<i+class="fa+fa-camera-retro+fa-10x"+>而不是<i+class="fas+fa-camera-retro+fa-10x"+>+</pre>|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2553857|entityMap^0|2|16|1B|1E|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

it's <code>&lt;i class="fa fa-camera-retro fa-10x" &gt;&lt;/i&gt;</code> not <code>&lt;i class="fas fa-camera-retro fa-10x" &gt;&lt;/i&gt; &lt;/pre&gt;</code>

blocks|key|1137708|text|你的问题是'fa‘而不是'fas’|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1137709|<i+class="fa+fa-camera-retro+fa-10x"+>|code-block|syntax|javascript|1137710|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

your problem is 'fa' and not 'fas'

<pre><code>&lt;i class="fa fa-camera-retro fa-10x" &gt;&lt;/i&gt;
</code></pre>

I decided it was time for me to switch to Font-awesome 5 when I ran into a problem. My icons are not shown. It shows me this. <a href="https://i.stack.imgur.com/VlFEy.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VlFEy.png" alt="enter image description here"></a>

I don't get where the problem occurs. I followed every step on their site and linked the files correctly but they still dont show. Here is a screenshot of the file.

<a href="https://i.stack.imgur.com/zcWtk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/zcWtk.png" alt="enter image description here"></a>

What is causing this? Why doesn't it work?

Font-awesome 5 not working

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云AI代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

功能1上新10个字符

功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符功能2描述100个字符。

功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符功能2上新100个字符。

功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符功能5描述100个字符

功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符功能5上新100个字符

功能4上新

文章&问答评论现已支持表情

全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验

社区富文本编辑器全新改版！诚邀体验～ 

精选全网热门MCP server，让你的AI更好用 🚀

💥开发者 MCP广场重磅上线！

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

当我遇到一个问题时，我决定是时候换到字体-可怕的5。我的图标没有显示。它给我看了这个。​我不知道问题出在哪里。我跟踪他们的网站上的每一步，并正确链接文件，但他们仍然没有显示。这是文件的截图。​​是什么引起的？为什么不动呢？

问字体-可怕的5不起作用
EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问字体-可怕的5不起作用EN

回答 8

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问字体-可怕的5不起作用
EN