如何更改字体真棒图标的颜色 \f107 颜色。 “.icon-classname{color: red;}”不起作用答案

【问题标题】：how to change colour of font awesome icon \f107 color. ".icon-classname{color: red;}" does Not work如何更改字体真棒图标的颜色 \f107 颜色。 “.icon-classname{color: red;}”不起作用
【发布时间】：2020-05-20 01:35:48
【问题描述】：

由于某种原因，图标没有将颜色变为红色。它保持白色/灰色。

有人知道如何将颜色变为红色吗？

.sidebar .nav-item .nav-link[data-toggle=collapse]::after {
            color: red;
            width: 1rem;
            text-align: center;
            float: right;
            vertical-align: 0;
            border: 0;
            font-weight: 900;
            content: '\f107';
            font-family: 'FontAwesome';
        }

还有很多其他问题不涉及我正在使用的类型“CSS 伪元素”。

【问题讨论】：

这能回答你的问题吗？ Can I change the color of Font Awesome's icon color?
检查你给出的类名和这个结构（.sidebar .nav-item .nav-link[data-toggle=collapse]::after），因为你已经写了父子关系跨度>
@Awais，谢谢。但是，这不是使用 CSS 伪元素
@RandomStuff fontawesome 图标充当文本，就像您使用 color 属性为文本着色一样，我的行为就是这样。只要确保没有覆盖样式。
进入检查器，看看是否有其他东西覆盖了您的样式 - 您的代码应该可以正常工作。

标签： html css font-awesome

【解决方案1】：

.icon-classname{
  color: #f00;
}

【讨论】：

这似乎不起作用。我认为是因为它是 CSS 伪元素
.icon-f107{ 颜色：#f00; } 这就是你的建议？
是的@RandomStuff
不要写 .icon-f107 让我们说如果你使用帮助图标尝试使用类名作为 .icon-help
如果这不起作用，那么可能会覆盖您的样式请检查收费栏