我的gulp iconfont呈現像一個醜陋的現場跟蹤圖標

當我放大我的導航時，我注意到我的圖標看起來不對。我正在使用Gulp-iconfont（npm包），只是在鏈接中描述了默認模板和樣式。我的gulp iconfont呈現像一個醜陋的現場跟蹤圖標

我的HTML：

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

任何人都可以幫助我解決這個問題嗎？

似乎源圖標是不正確的。請檢查一個測試與不同的SVG圖標 – Sato

^謝謝@sato這實際上是問題。我跑遍了所有的圖標，還有一些沒有固定的大小。這使得圖標字體渲染不正確。 – Michieltronaut

由於I see，所有圖標感覺不舒服。要修復它的fontHeight設置添加到gulp-iconfont配置：

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

2017-10-14 01:32:51 Finesse

回答