Css 如何更改图标上图标的图标颜色

Css 如何更改图标上图标的图标颜色,css,html,icons,Css,Html,Icons,我从网站下载了一些图标,但是图标的背景颜色是黑白的。我想给我自己的颜色。有人能告诉我怎么做吗 当我下载图标时,我得到了下面的style.css @font-face { font-family: 'icomoon'; src:url('fonts/icomoon.eot?-haa506'); src:url('fonts/icomoon.eot?#iefix-haa506') format('embedded-opentype'), url('fonts/

我从网站下载了一些图标,但是图标的背景颜色是黑白的。我想给我自己的颜色。有人能告诉我怎么做吗

当我下载图标时,我得到了下面的style.css

@font-face {
    font-family: 'icomoon';
    src:url('fonts/icomoon.eot?-haa506');
    src:url('fonts/icomoon.eot?#iefix-haa506') format('embedded-opentype'),
        url('fonts/icomoon.woff?-haa506') format('woff'),
        url('fonts/icomoon.ttf?-haa506') format('truetype'),
        url('fonts/icomoon.svg?-haa506#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-home:before {
    content: "\e600";
}
.icon-images:before {
    content: "\e601";
}
.icon-pawn:before {
    content: "\e602";
}

图标应视为文本

如果你给它们涂上颜色。他们会改变颜色

例如:

.icon-pawn { color: red; }

我必须使用::after伪元素

.icon pawn::在{color:red;}之后

不过,我不确定这是否是我的项目特有的,因为我正在对其他人的代码进行小的更改。

这对我来说很有效:

.图标颜色成功:之前{ 颜色:28a745!重要; } 然后:


你能提供一些CSS代码吗?@arnold我已经添加了CSS文件,请看一下,然后将颜色属性更改为图标…将它们视为文本。a、 k.a如果你写颜色:红色;他们会转向的red@drip我将在哪里写颜色属性?在css中,还有什么地方…正如承诺的那样,我已经接受了你的答案并投了赞成票。如果我在未来遇到任何问题,请帮助我。我也面临着这个棘手的问题,你找到了解决方案或原因吗?