zoukankan      html  css  js  c++  java
  • Day7-微信小程序实战-引入iconfont(充分利用iconfont图标库的资源)

    一、引入iconfont

    首先在iconfont.com中注册登陆:

    点击上方【图标管理】并进入我的项目

    注意:如果没有项目的话,就点击右边的来创建项目

    在官网中找到想要的图标之后,以SVG的形式下载下来,然后在iconfont【我的项目】中上传刚下载下来的图标

     上传的时候记得对图标命名为【英文的】

    这样就创立了自己项目要用到的图标了

    那如何在微信开发者工具中使用呢?

    新创一个iconfont文件

    再回到iconfont中【我的项目】

    可以直接复制这个链接,在网页中打开这个链接会发现,是一个在线的css样式:

    复制这个页面的全部代码,到iconfont.wxss中即可

    然后在app.wxss文件中引入这个iconfont.wxss文件

    @import "style/iconfont/iconfont.wxss"

    即可在主页中使用这些图标了

    比如:

    我想要使用右箭头:【在iconfont我的项目中复制这个图标的代码】

     在index.wxml中使用(class中要包含引入的iconfont.wxss的名字,还有要使用的图标的代码---iconyoujiantou)

    <text class="iconfont iconyoujiantou"></text>

    效果图:

  • 相关阅读:
    java第一次作业
    第十一次作业
    第十次作业
    第九次作业
    第八次作业
    第七次作业
    第六次作业
    第五次作业
    实验四,实验五
    Java_实验二
  • 原文地址:https://www.cnblogs.com/SCAU-gogocj/p/13158018.html
Copyright © 2011-2022 走看看