html 文字上面 图标,HTML – 多彩多姿的图标字体

好的,我将逐步完成这项工作：

ILLUSTRATOR PART

>在插图画家中将图标复制到新文档中.

>然后切一种颜色.

>按另存为并保存为SVG

>然后粘贴您剪切的那个并删除另一个.

>另存为另一个SVG.

ICOMOON

>真的是一个很棒的网站.

>启动应用程序.

>导入svg并下载保存.

然后这是我用于多彩色字体图标的一类解决方案的CSS：

CSS

.icon-earth{

font-family: 'icomoon';

speak: none;

font-style: normal;

font-weight: normal;

font-variant: normal;

text-transform: none;

line-height: 1;

-webkit-font-smoothing: antialiased;

}

.icon-earth:after {

content: "\e006";

color:#F33;

font-size:6em;

}

.icon-earth:before {

content: "\e007";

color:#0C0;

font-size:6em;

letter-spacing:-1em;

}

HTML

它安静易于解释CSS为您自己的需求,如果需要帮助请大声说,我将逐步完成这个…

最后这是JSFIDDLE,虽然我不能在JsFiddle中发现自定义图标字体……

浏览器支持是IE8及以上,然后我检查的其他一切..