icon的几种做法

2018-09-27  本文已影响0人  索伯列夫

方法:
1.img法
2.background法
3.background合一法
4.font法
5.SVG法
6.新手慎用【CSS就是干】法

img法

直接用img标签就可以。
好处:可以自适应,可以设置宽高。

background法

用background背景图设置;
注意设置no-repeat;
好处,当div的宽高发生变化时,背景图不会随着它变化。
在css sprites(雪碧图)中应用,直接使用生成器就可以~

icon-font

使用字体文件就可以。这个字体文件比较特殊是icon。
可以用html/css/js来分别实现

SVG推荐使用

优先使用symbol
这三种的使用方法,查看iconfont

css画,不推荐

参考:cssicon.space

ps导出图层:

1.右键图层 点击
2.在选中图层(右边)右键,复制图层。
复制图层
放在新文档
3.新文档只有我们选中的 新文档
4.裁剪我们需要的,可能需要调整画布大小 裁剪
5.导出 导出
上一篇 下一篇

猜你喜欢

热点阅读