更改 fontawesome 图标的样式

Question

我在 angular 代码中使用了很棒的字体图标。我的代码如下：

component.ts:
import { faSquare } from '@fortawesome/free-solid-svg-icons';

 faSquare =faSquare;

html:

<fa-icon [icon]="faSquare"</fa-icon>

我想改变宽度、高度并将这个正方形旋转 45 度。我尝试使用内联样式提供样式，但它不起作用。怎么做？

Answer 1

您可以为图标提供内联样式，如：

    <fa-icon [icon]="faSquare" [styles]="{height: '30px', width: '30px', transform: 'rotate(45deg)'}"></fa-icon>

输出：

您还可以参考 Features 文档来探索更多内容。

Changing styles of fontawesome icons