Font为什么图标以SVG格式呈现?

FontAwesome why icons renders in SVG format?(Font为什么图标以SVG格式呈现?)
本文介绍了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

这篇关于Font为什么图标以SVG格式呈现?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

wkhtmltopdf print-media-type uses @media print ONLY and ignores the rest(Wkhtmltopdf print-media-type仅使用@media print,而忽略其余内容)
Minify CSS with Node-sass(使用Node-Sass缩小CSS)
Nested Table in jspdf(Jspdf中的嵌套表)
How to rotate outer div not inner content(如何旋转外部div而不是内部内容)
how to apply css transform to child on parent hover(如何对父级悬停时的子级应用CSS变换)
Only transition a transform in css?(是否仅在css中转换转换?)