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

Question

我使用Font Awesome 5工作：

<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框架吗？我不是Font Awesome传统主义者。你可以设置不同颜色，大小和旋转的字体吗？

Answer 1

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

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

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

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