font-awesome 相关问题

无法解码下载的awesome font

我的网站使用 fontawesome https://fontawesome.com/ 作为图标。今天当我访问网站时，fontawesome图标加载失败，然后我打开devtools，显示警告（这个网站可以工作...

如何在不使用任何第三方库的情况下在React Native项目中使用Font Awesome？

我想在我的 android 反应本机项目中使用 Font Awesome 图标。 我想手动执行此操作，而不使用任何第三方库，例如react-native-vector-icons或其他库。

未捕获错误：找不到模块“@fortawesome/free-regular-svg-icons”

我正在尝试将 ReactJS 与 font-awesome 一起使用，但出现模块未找到错误。这些文件位于 npm 模块文件夹中，所以我不确定出了什么问题。 我的包裹里有以下物品。

Fontawesome 无法工作，因为图标未显示在页面中

我已从他们的网站添加了 fontawesome 链接，但图标未显示在页面中 我使用了两个链接，即 <question vote="0"> <p>我已经从他们的网站添加了 fontawesome 链接，但图标没有显示在页面中</p> <p>我使用了两个链接，即</p> <pre><code>&lt;script src=&#34;https://kit.fontawesome.com/5a384e9641.js&#34; crossorigin=&#34;anonymous&#34;&gt;&lt;/script&gt; &lt;link href=&#34;http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css&#34; rel=&#34;stylesheet&#34; type=&#39;text/css&#39;&gt; </code></pre> <p>对于<pre><code>&lt;i class=&#34;fa-sharp fa-solid fa-pancakes&#34;&gt;&lt;/i&gt;</code></pre></p> <p>但不工作</p> </question> <answer tick="false" vote="0"> <p>您正在使用版本 <pre><code>4.3.0</code></pre>，它仍然需要将 <pre><code>fa</code></pre> 类添加到图标元素才能首先正常工作；其次，v4.3 似乎不包含您想要使用的图标。 <pre><code>&lt;i class=&#34;fa fa-camera-retro&#34;&gt;&lt;/i&gt;</code></pre> 例如，可以与您正在使用的版本配合使用。</p> <p><em>（移动评论以回答更容易找到解决方案，信用@CBroe）</em></p> </answer> </body></html>

字体很棒图标在更改字体时消失

我正在尝试在我的网页中加入字体很棒的图标，一切正常，直到我更改为我选择的字体 Exo 2，并且图标显示为带边框的正方形。它与其他 f 配合得很好...

为什么使用Nuxt v3静态生成时<font-awesome-icon />会输出两次后面的内容？

我正在将 vue-fontawesome 与 Nuxt 3 一起使用，如此处所述，我看到了这种奇怪的行为。说我有这样的东西 我正在将 vue-fontawesome 与 Nuxt 3 一起使用，如here所述，我看到了这种奇怪的行为。说我有这样的东西 <a href="https://example.com"><font-awesome-icon icon="fa-brands fa-twitter" />Example</a> 如果我运行开发服务器，一切都很好，但如果我运行 generate 并通过静态 HTTP 服务器提供输出，我会打印两次“示例”。如果我将文本包装在标签中，我会得到标签和文本两次（即<span>Example</span><span>Example</span>）。但奇怪的是，生成的 HTML 不包含重复，所以我怀疑浏览器中发生了一些奇怪的事情。 您可以从此处获取生成的站点作为可重现的测试用例。 https://andreafranceschini.org/files/afnuxt.tgz 我听说vue-fontawesome对SSR和静态生成不太满意，但我也看到其他人以同样的方式使用它，所以我想知道我可能做错了什么？ 编辑我也将其发布为“错误”here。 编辑 2 解决方法是将图标单独包含在其他内容中，例如 span 标签。 我找到了一个解决方法，即将图标单独包含在其他东西中，例如 span 标签。 尝试将以下内容添加到您的 nuxt.config.ts 文件中： build: { transpile: [ '@fortawesome/fontawesome-svg-core', '@fortawesome/free-solid-svg-icons', '@fortawesome/free-regular-svg-icons', '@fortawesome/free-brands-svg-icons', '@fortawesome/vue-fontawesome' ] } （根据需要调整具体图标包导入。） 我只能在两个地方找到网上提到的这个解决方案[1][2]，两个地方都没有提到这个重复问题。值得注意的是，所有官方文档中都没有它。 也就是说，至少对我来说，这解决了这个问题以及控制台中Could not find one or more icon(s)错误消息的问题。 谢谢@callum-watkins，你救了我的命。 Font Awesome Office 文档中似乎缺少 nuxt.config.ts 中的构建配置： 配合使用

如何使用 CSS3 制作 Google Now 麦克风图标？

我正在尝试使用纯 CSS3 创建“Google Now”麦克风图标。 该图标在红色圆形背景上有一个白色麦克风。 我尝试了 font-awesome 但没有成功 我需要你的帮助来完成...

类型“IconDefinition”无法使用 React 在 FontAwesome 中分配给类型“IconProp”

我正在使用 FontAwesome 图标开发 React 应用程序。当尝试使用 @fortawesome/react-fontawesome 中的 FontAwesomeIcon 组件渲染图标时，我遇到了以下错误：

将 fontawesome 添加到故事书 Angular nx

我有一个 ui 组件： 从 '@angular/common' 导入 { CommonModule } ； 从“@angular/core”导入{组件、EventEmitter、输入、输出}； 从 '@angular/material/co... 导入 { MatRippleModule }

当我使用这个时。 (<i class="fal fa-shopping-cart cart"></i>)它在我的html页面中的显示框。我的购物车没有显示，谁能帮我摆脱这个[关闭]

帮我解决这个问题，我想摆脱它。 如果我使用这段代码 如果我使用这个，我的网页上会出现方框。 我正在尝试...

如何在param Visual Composer中使用fontawesome？

我使用视觉编辑器编写元素代码。我想在 element 中使用 FortAwesome。 此处的代码在参数 Visual Composer 中显示 FortAwesome 列表 大批（ '类型' => '图标选择器', '标题' => esc_ht...

Font Awesome 图标未出现

我看到几个人描述了类似的问题，但我所看到或尝试过的都没有解决我的问题。我在本地存储 Font Awesome 5 文件，但是当我尝试添加一些图标时却没有添加

Nx Angular 在开发模式下持续构建

我正在开发的一个项目有 Nx 用于将前端作为 monorepo 进行处理。这个仓库有一个项目，我们称之为 XYZ，并且对于这个项目，配置了 tailwindcss、font Awesome 和其他东西。 我的主要

在列表项后放置一个图标：after 和 font Awesome

我在使用 font Awesome 和 :after 让图标直接出现在 中的列表项之后时遇到问题。 具有活动类的 后面应该有图标，但是当 我在使用 font Awesome 和 <ul> 使图标直接出现在 :after 中的列表项之后时遇到问题。 具有活动类的 <li> 后面应该有图标，但是当在关闭列表项之前添加另一个 <ul> 时，它会将图标放在整个辅助列表后面。 <div id="thirdLevMenu"> <ul> <li class="active">Integrated Coastal Watershed Management Plans <ul> <li><a href="http://design-irwmp3.migcom.com/app_pages/view/7931">Russian River Integrated Coastal Watershed Management Plan</a></li> <li><a href="http://design-irwmp3.migcom.com/app_pages/edit/http:/www.goldridgercd.com/watersheds/salmoncreekplan.html" target="_blank">Salmon Creek Coastal Watershed Management Plan</a></li> <li><a href="http://design-irwmp3.migcom.com/app_pages/edit/http:/www.mattole.org/plan" target="_blank">Mattole Coastal Watershed Management Plan</a></li> <li><a href="http://design-irwmp3.migcom.com/app_pages/edit/http:/www.trinidad.ca.gov/documents-library/category/30-icwmp.html" target="_blank">Trinidad-Westhaven Coastal Watershed Management Plan</a></li> </ul> </li> </ul> </div> 我一生都无法弄清楚我做错了什么。 这是我的jsfiddle 正如我在评论中提到的： “当您在顶部 <ul> 内添加第二个 <li> 时，整个内部列表将成为父列表项的一部分。它也完全按照您的指示进行操作，它将箭头直接放在 <li> 之后.” 如果您希望图标位于“综合沿海流域管理计划”文本之后，请在该标题周围添加一个跨度，并调整 CSS 以将 :after 伪元素添加到该跨度而不是整个 <li>。 HTML <li class="active"> <span class="title">Integrated Coastal Watershed Management Plans</span> ... </li> CSS #thirdLevMenu ul li.active .title:after{ content: '\f0da'; font-family: FontAwesome; font-weight: normal; font-style: normal; margin:0px 0px 0px 10px; text-decoration:none; } 这是更新的小提琴。

为 Mediawiki 项目编译 Awesome 6 Pro 字体时出现问题

我被分配了一个新项目。这是一个 Mediawiki 项目。现在我对 Font Awesome 6 的更新感到有点不知所措。网站上有些图标不显示。我找到了这个地方...

错误：缓存未配置。当我将 Font Awesome 安装到我的 React 应用程序时，Babel 的插件

我想在我的 React 应用程序中使用 Font Awesome，但是当我安装 Font Awesome 的 npm 时，我遇到了这个错误： 错误：缓存未配置。 Babel 的插件、预设和 .babelrc.js 文件...

在 docker 构建期间访问 ENV VARS

我一直在寻找一个合适的解决方案，可以在我的docker构建中访问环境变量。我知道我可以通过 buildArgs，但这意味着我必须提供 ENV VAR ...

HTML/CSS - 字体图标：从 css 文件调用时，来自 fontawesome 的类不起作用

我对 HTML/CSS 编码相当“陌生”，所以如果这个主题很琐碎，我深表歉意。 这涉及字体图标的使用，更准确地说是 Fontawesome。 HTML 文件：在我的 html 文档中，图标是 em...

在 Rails 中嵌入很棒的字体 icon_to

我想要一个如下按钮： [用FB登录] 其中 FB 是一个字体很棒的图标。我尝试了以下操作，但无法弄清楚如何将图标嵌入到按钮中： =button_to“逻辑...

将fontawesome添加到web组件的shadowroot中

我创建了一个用于创建 Web 组件的 JS 脚本。该 Web 组件使用 Font Awesome 图标。当我将 Font Awesome 库添加到 HTML 的头部时，图标可以正常工作......