在iconfont.cn选择图标注意的几个问题, iconfont图标大小

在用iconfont的过程中,经常遇到图标大小显示不一致,实际上是因为在选的时候没有注意到细节,注意到下面的几个细节,就可以图标大小一致,下图为例:

fonicon大小对比

1、用chrome查看,黑色的框内(svg.icon)数值一致,此值显示了原图的比例,如果比例不一致,导致图标大小不一。

2、在淡蓝色的区块中,明显看到钻石的顶部和底部没有抵满,在页面上显示的时候会显示钻石更小,虽然尺寸一样。

3、明显钻石的线条更粗,这样如果背景和字体的颜色反差较大,能明显感觉钻石突兀,所以选的时候尽量选择线条粗细一致的图标。

另外在选择图标的时候尽量选择同样边框的图标,比如一个是圆角一个是直角的图标,这两种图标排列在一起的时候,感觉很不好。