如何增加字体真棒图标的大小

字体真棒（Font Awesome）是一种广泛使用的矢量图标集，它提供了众多的图标，供开发者使用。但是，在某些情况下，我们可能需要增加或减小这些图标的大小。本篇文章将会介绍如何增加字体真棒图标的大小。

使用CSS

通过CSS可以很容易地改变字体真棒图标的大小。我们可以使用 font-size 属性来控制图标的大小，如下所示：

[class^="fa-"], [class*=" fa-"] {
    font-size: 2em;  // 改变图标大小
}

在上面的示例中，我们使用 font-size 属性将所有 Font Awesome 图标的大小设置为 2 倍。

使用JS

如果你想在运行时动态更改字体真棒图标的大小，可以使用JavaScript来完成。我们可以通过获取图标元素的样式属性，然后改变其大小。下面是一个使用jQuery来增大字体真棒图标大小的示例：

$(".fa").css("font-size", "2em"); //获取所有 Font Awesome 图标元素，并增加图标大小

使用HTML

在某些情况下，我们可能会采用HTML标记来改变Font Awesome图标的大小。Font Awesome图标的大小可以通过其父元素大小来决定，只要通过设置其父元素的样式属性就可以改变图标的大小。例如：

<div style="font-size: 2em;">
    <i class="fas fa-adjust"></i>
</div>

在上面的代码片段中，我们设置父元素的 font-size 样式为 2em，这将使其包含的 Font Awesome 图标变大。

总结

以上介绍了三种不同的方式来增加字体真棒图标的大小。使用CSS、JS以及HTML都可以轻松完成这项工作。

使用CSS可以在样式表中直接设置图标大小，对于固定的大小非常有用。

使用JS可以在运行时动态更改图标的大小，对于可交互的UI非常有用。

使用HTML可以通过父元素大小来控制图标的大小，简单易用。

注：Font Awesome 图标名例举为 fa-adjust，实际代码中需要根据引入 Font Awesome 的版本和使用图标类型进行修改。