字体很棒的图标不改变颜色反应

Question

我正在尝试更改 FontAwesomeIcon 的颜色，但它保持白色。

我尝试使用style={{color: 'lime'}}、color="green"、 并向图标添加一个类并设置该类的样式。

      <li class="actions">
        <FontAwesomeIcon icon={faPlay} className="start" style={{ 'color': "lime" }} />
        <FontAwesomeIcon icon={faStop} className="stop" />
        <FontAwesomeIcon icon={faTrash} className="delete" />
        <FontAwesomeIcon icon={faPencilAlt} className="edit" />
      </li>

我希望图标是石灰色，但它仍然是白色的。

我发现如果我将 html 上的 svg 中的“填充”更改为“石灰”，它会改变颜色。

Answer 1

显然也有一个color道具。FontAwesomeIcon所以你可以这样做：

<FontAwesomeIcon icon={faPlay} className="start" color="lime" />

Answer 2

我找到了一个解决方法，如果我path使用 css 和颜色来定位元素，它将为图标着色。

.actions svg path { color: lime; }