首页 > 解决方案 > 在 Web 应用程序中使用新的自定义图标

问题描述

我使用Glyphter从自定义 SVG 文件创建图标。我现在正在尝试使用它,希望是这样的:

<i class='myIcon'></i>

但是仅仅将它作为字体系列添加到一个类中是行不通的。我似乎无法弄清楚如何使用它。我有生成的 CSS 文件:

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

[class*='icon-']:before{
    display: inline-block;
   font-family: 'Glyphter';
   font-style: normal;
   font-weight: normal;
   line-height: 1;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale
}
.icon-clear-filter:before{content:'\0048';}

标签: cssfont-face

解决方案


推荐阅读