我的gulp iconfont渲染得像一个丑陋的实时追踪图标

Question

当我放大导航时，我注意到我的图标会显示出来。我正在使用Gulp-iconfont（npm包），只使用默认模板和样式，如链接所示。

我的HTML：

<li class="pageNav_metaItem">
 <a href="#" class="pageNav_metaLink"><i id="open-apps-bar" class="icon-apps"></i></a>
</li>

Rendered font .svg file。

任何人都可以帮我解决这个问题吗？

Answer 1

作为I see，您的所有图标都感觉不舒服。要解决此问题，请将fontHeight设置添加到gulp-iconfont配置：

// ...
.pipe(require('gulp-iconfont')({
    fontName: 'icons',
    formats: ['eot', 'woff', 'woff2'],
    fontHeight: 1024
}))
// ...