如何使用svg框架调整图标大小

Question

我使用以下命令让Font Awese5工作：

<i class="fa fa-user"></i>
<script src="/js/packs/solid.js"></script>
<script src="/js/fontawesome.js"></script>

但是设置i标记的样式没有任何效果。所以我试着用网页字体代替：

<link rel="stylesheet" href="css/font-awesome-core.css">
<link rel="stylesheet" href="css/font-awesome-solid.css">
<i class="fas fa-user"></i>

而且它起作用了。但是我不应该使用svg框架吗？我不是一个字体很棒的传统主义者。你能用不同的颜色，大小和旋转来设计字体吗？

Answer 1

SVG框架将标记转换为源代码中完全呈现的FontAwesome5代码。

图标/SVG的样式可以通过设置父对象的样式来控制。

<div style="font-size: 200%; color: red">
<i class="fas fa-user"></i>
</div>

这将以2倍的大小呈现红色图标。