只有某些FontAwesome 5图标的渐变

时间:2018-02-15 14:06:15

标签: html css font-awesome-5

所以我目前正在使用这个解决方案,它允许我在Font Awesome 5图标上使用渐变:Solution 11925: for Font Awesome 5 Icon Gradients。但是,当我在此解决方案中使用该方法时,它会对所有Font Awesome 5元素应用渐变,因为它将SVG * fill CSS规则应用于所有这些元素。我不想将规则应用于所有这些规则。有没有办法让它只适用于某些?因为我想为单独的部分使用单独的渐变?

这是我的CSS代码:

svg * {
fill: url(#rg);
} 

它目前正在将这个规则应用于这些字体真棒5个图标,这很好:.fa-html5, .fa-css3-alt, .fa-js, .fa-camera-retro, .fa-pencil-alt, .fa-sass { font-size: 4rem; }

我想对这些图标应用不同的渐变:

.fa-calendar-alt,
.fa-newspaper,
.fa-paper-plane,
.fa-searchengin,
.fa-users,
.fa-newspaper,
.fa-paint-brush, 
.fa-code, 
.fa-object-ungroup {
    font-size: 2rem;
}

0 个答案:

没有答案