字体真棒图标不呈现
Font Awesome icons not rendering
我正在尝试通过将它添加到我的 React 组件中来使用超赞的 Twitter 图标,在我的本地浏览器中它工作正常,但是当我在代码笔中复制粘贴相同的代码时它不起作用,所以任何知道如何解决这个问题吗?
您缺少添加 Font Awesome 作为依赖项。添加https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css
它。
您刚刚完成以下步骤:
步骤1:npm安装--save font-awesome
步骤 2:import 'font-awesome/css/font-awesome.min.css';
第 3 步:
不要忘记使用 className 作为属性
function yourcomponent() {
return <div><i className="fa fa-spinner fa-spin">no spinner but why</i></div>;
}
我已经设法让它与你的例子一起工作。
添加 font-awesome 作为依赖项 link (Settings -> CSS -> Add External Stylesheets/Pens
):
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css
像这样使用图标(字体很棒的新语法version5):
<i className="fab fa-twitter"></i>
<i className="fab fa-tumblr fa-2x"></i>
我正在尝试通过将它添加到我的 React 组件中来使用超赞的 Twitter 图标,在我的本地浏览器中它工作正常,但是当我在代码笔中复制粘贴相同的代码时它不起作用,所以任何知道如何解决这个问题吗?
您缺少添加 Font Awesome 作为依赖项。添加https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css
它。
您刚刚完成以下步骤:
步骤1:npm安装--save font-awesome
步骤 2:import 'font-awesome/css/font-awesome.min.css';
第 3 步: 不要忘记使用 className 作为属性
function yourcomponent() { return <div><i className="fa fa-spinner fa-spin">no spinner but why</i></div>; }
我已经设法让它与你的例子一起工作。
添加 font-awesome 作为依赖项 link (Settings -> CSS -> Add External Stylesheets/Pens
):
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css
像这样使用图标(字体很棒的新语法version5):
<i className="fab fa-twitter"></i>
<i className="fab fa-tumblr fa-2x"></i>