美文网首页
在uni-app和微信小程序中使用阿里矢量图标库

在uni-app和微信小程序中使用阿里矢量图标库

作者: 前端里程 | 来源:发表于2019-08-05 12:18 被阅读0次

    一、uni-app使用
    1、搜索自己想要的图标添加到购物车


    image.png

    2、点开购物车,点击“添加至项目”,选择你想要加入的项目工程,最后“确认”


    image.png

    3、点击生成在线文件(我这不是第一次生成,提示的是更新代码)


    image.png

    4、点击复制代码


    image.png

    5、App.vue引入在线链接;记得要添加https: 不然又毛病。

    image.png

    6、页面使用,iconfont是必须要的。icon-xiazai就是图标库有的,点击图上的复制代码就可以拿到。


    image.png

    显示效果:


    image.png

    二、微信小程序使用
    1、下载文件到本地


    image.png

    2、把iconfont.css改为iconfont.wxss


    image.png
    3、app.wxss引入iconfont.wxss
    image.png
    4、页面使用(图标大小用font-size控制)
    image.png

    相关文章

      网友评论

          本文标题:在uni-app和微信小程序中使用阿里矢量图标库

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