美文网首页
icon的几种做法

icon的几种做法

作者: 索伯列夫 | 来源:发表于2018-09-27 11:28 被阅读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.导出 导出

    相关文章

      网友评论

          本文标题:icon的几种做法

          本文链接:https://www.haomeiwen.com/subject/uvvsoftx.html