标签: font-awesome-5

我正在尝试在我的项目中嵌入fontawesome 5图标。我需要在伪元素（：before，：after）中添加图标。我可以添加常规图标，但不能添加实体图标。两者具有相同的unicode值。到目前为止，这是我的CSS，

label.star:before {
  content: '\f005';
  font-family: 'Font Awesome 5 Free';
}

现在，它显示常规的星形图标。如何使它成为实心图标？

提前致谢。

我正在尝试将Fontawesome专业版添加到我的反应应用中.

我在Font Awesome的入门标签上尝试了几乎所有的选项 - 所有产生的都是免费品牌.所以 - 现在我有一个混搭的尝试,并且目前坚持按照clodal在这篇文章中提出的指示

我有一个包含以下依赖项的package.json:

"@fortawesome/fontawesome-svg-core": "^1.2.8",
"@fortawesome/pro-light-svg-icons": "^5.5.0",
"@fortawesome/free-solid-svg-icons": "^5.5.0",
"@fortawesome/pro-regular-svg-icons": "^5.5.0",
"@fortawesome/pro-solid-svg-icons": "^5.5.0",
"@fortawesome/react-fontawesome": "^0.1.3",

我看过这篇文章并注意到其他人正在努力弄清楚如何开始使用字体真棒.

我已将全局配置身份验证令牌添加到我的应用程序.

我在这里阅读了升级说明.

目前 - 我收到的错误是:

 Error: Can't resolve '@fortawesome/pro-brands-svg-icons' in '/Users/18/src/routes/How/components/HowPage'

在那个页面中,我有:

 import React from 'react'
    import PropTypes from 'prop-types'
    import classes from './HowPage.scss'

    import GridContainer from "components/Grid/GridContainer.jsx";
    import GridItem from "components/Grid/GridItem.jsx";
    import Clearfix from "components/Clearfix/Clearfix.jsx";
     import { library } from '@fortawesome/fontawesome-svg-core'
import { fas } from '@fortawesome/pro-solid-svg-icons'
import { faTwitter } from …

以下代码显示了引导程序工具提示和本机标题属性工具提示：

This is my text. 
<i class="far fa-question-circle" data-toggle="tooltip" title="This is my tooltip."></i> 
$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})

小提琴

我怎样才能不显示 Fontawesome 5 的 icon-svg 的原生标题属性，所以只显示 Bootstrap-tooltip？

有人可以建议我如何将FontAwesome 5 Pro与React 集成吗？

我知道有@ fortawesome / react-fontawesome软件包，例如@ fortawesome / fontawesome-free-regular，但是有没有办法包含专业版的图标？

当我登录FontAwesome网站时，可以下载pro-version JS，但是我猜这在React中没有用。

1. 我正在使用 CSS 内容属性，因为它的加载速度比标签快。
   
2. “fa-user”图标类有两组图标，即“far”和“fas”，但它们共享相同的Unicode“\f007”。这是个问题。
   
3. 获得的结果只有一个缺点。图标在页面加载几秒钟后加载。因此，它与用户体验混乱。
   
4. 使用标签加起来就是带注释的 HTML 标记。
   

那么，有没有办法我仍然可以使用 CSS 内容属性并在"far"和"fas"类之间切换？

有什么建议可以解决这个问题吗？

有没有办法在Vue中安装fontawesome？我尝试了很少的教程,但它们都没用,无法工作或图标为空或插件根本无法渲染!我不想通过脚本导入字体,我想在我的应用程序中安装它.我尝试了这个教程(https://github.com/FortAwesome/vue-fontawesome),但无论我做了什么图标都不呈现,也许有人可以指点我的解决方案？

这是我的代码,但图标甚至不呈现:

import FontAwesomeIcon from '@fortawesome/vue-fontawesome';


export default {
  name: 'App',
  components:{FontAwesomeIcon}
}

<template>
  <div id="app"><font-awesome-icon icon="spinner" /></div>
</template>

另外,我在控制台中收到错误:

检查找不到一个或多个图标{前缀:"fas",iconName:"spinner"} {}

我正在使用 Font Awesome 5.0.13。某些图标未在 Chrome 中显示。例如“fa-instagram”。有没有办法修复它或等待下一个版本？这是我在 chrome 中看到的。

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-3AB7yXWz4OeoZcPbieVW64vVXEwADiYyAEhwilzWsLw+9FgqpyjjStpPnpBO8o8S" crossorigin="anonymous">
<a href="#" target="_blank" class="icon-facebook">
  <i class="fab fa-facebook-f">
    </i>
</a>
<a href="#" target="_blank" class="icon-twitter">
  <i class="fab fa-twitter">
    </i>
</a>
<a href="#" target="_blank" class="icon-google_plus">
  <i class="fab fa-google-plus-g">
    </i>
</a>
<a href="#" target="_blank" class="icon-pinterest">
  <i class="fab fa-pinterest">
    </i>
</a>
<a href="#" target="_blank" class="icon-linkedin">
  <i class="fab fa-linkedin-in">
    </i>
</a>
<a href="#" target="_blank" class="icon-instagram">
  <i class="fab fa-instagram">
    </i>
</a>
<a href="#" target="_blank" class="icon-tumblr">
  <i class="fab fa-tumblr">
    </i>
</a>

有人可以让我知道一些如何使用 NPM 向 Buefy 添加和配置 Font Awesome 5 字体的示例。

这方面的文档非常稀少。谢谢！

https://buefy.github.io/documentation/start

我无法在我的组件中使用字体真棒品牌图标我尝试导入它，但没有任何图标。

import {faTelegram} from "@fortawesome/angular-fontawesome"; // Has no exported member

但正如我们所看到的，fontawesome-5 中提供了品牌图标 https://fontawesome.com/icons/telegram?style=brands

这个图标怎么用啊！？

我已经在我的package.json 中安装了 Fontawesome 。

"devDependencies": {
    "@fortawesome/fontawesome-free": "^5.11.2" ,
    //etc.
},
"dependencies": { "font-awesome": "^4.7.0" }

并将其导入我的app.scss

@import "~font-awesome/scss/font-awesome.scss";

我试过了<i class="fa fa-edit"></i>，<i class="fas fa-edit"></i>但它只是如下所示，有人知道如何正确地做到这一点吗？