Font为什么图标以SVG格式呈现?
在我的Angular5项目中,我使用了字体图标:静态图标和微调图标。 我运行了NPM Install Font-AWOW,并安装了4.7.0版。
"dependencies": {
....
"font-awesome": "4.7.0"
}
在我的应用程序中。组件.html
<div class="center">
<i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
<p>Loading...</p>
</div>
但我在Chrome的dev控制台中看到的是:
并且微调工具没有正确的脉冲式动画。
如果我使用静态字体可怕的图标,它也会呈现为SVG。为什么?
解决方案
因为您使用的是包作为依赖项,所以这是基于文档的正常情况:https://fontawesome.com/how-to-use/svg-with-js
我们全新的基于SVG的框架,它为您提供了在Web上使用SVG图标的所有好处,而不是所有的麻烦。我们保持了简单的语法和步骤,并在此基础上构建了用于调整大小、放置和样式的工具。
如果您想以不同的方式使用它,我可以将其添加为css/sass文件中的字体,或者:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/vX.XX.XX/css/all.css"
单据:https://fontawesome.com/get-started/web-fonts-with-css
而不是作为js库:https://fontawesome.com/get-started/svg-with-js
相关文章