首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何更改图标月亮图标的图标颜色

如何更改图标月亮图标的图标颜色
EN

Stack Overflow用户
提问于 2014-02-09 23:37:19
回答 3查看 10.5K关注 0票数 0

我已经从icomoom下载了一些图标,但是图标的背景颜色是黑白的。我想给我自己的colour.Can,有谁可以告诉我怎么办?

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

代码语言:javascript
复制
@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";
}
EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2014-02-10 01:07:21

图标应被视为文本。

如果将颜色应用于它们。他们会改变他们的颜色。

示例:

代码语言:javascript
复制
.icon-pawn { color: red; }
票数 6
EN

Stack Overflow用户

发布于 2016-11-30 04:36:22

我必须使用::after伪元素。

.icon-pawn::after { color: red; }

我不确定这是否是我的项目所特有的,因为我正在对别人的代码做一些小的修改。

票数 2
EN

Stack Overflow用户

发布于 2019-09-10 17:36:31

这对我来说很有效:

代码语言:javascript
复制
.icon-color-success:before {
    color: #28a745 !important;
}

然后:

代码语言:javascript
复制
<i class="icon-python icon-color-success"></i>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/21661087

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档