微信小程序如何套用iconfont

前言
如果你在开发微信时,没有图标的话,可以到http://www.iconfont.cn/ 官方下使用图标,那么我们去使用一些吧,到官方网址下点击使用~


下载代码即可使用,看看下载的文件吧。

如图可以用demo_fontclass.html下的例子。打开微信小程序开发工具。

接下来使用代码:
<!--index.wxml-->
<view class="container">
<view>广州塔<i class="iconfont icon-ziyuan"></i></view>
</view>
/**index.wxss**/
@import '../iconfont/iconfont.wxss';
效果图:

结语
- 你完成了吗?是不是,很容易呢?是不是很简单呢?
微信小程序如何套用iconfont的更多相关文章
- 在微信小程序中引入 Iconfont 阿里巴巴图标库
小程序的代码包不能超过4M,为了压缩代码包的大小,可以通过第三方链接引入图标资源 Iconfont 无疑是最常用的第三方图标库,这里介绍一下在微信小程序引入 Iconfont 的方法 一.下载图标 首 ...
- 微信小程序如何引用iconfont图标
最近在研究微信小程序,自己写demo的时候想要引用巴里巴巴图标库的图标,于是: @font-face { font-family: 'iconfont'; src: url('iconfont.eot ...
- 如何在微信小程序中使用iconfont
开篇废话 开发过小程序的童鞋肯定都会遇到这样的问题,当我们在小程序中使用iconfont官方推荐的方法插入字体时,我们总会得到一个打印机(滑稽).那么如何在小程序中正确的使用iconfont呢? 一. ...
- 微信小程序本地引用iconfont(阿里巴巴矢量图标库)
好,忙,我懂..... 首先把图标放进项目里(废话): 接下来把这些图标下载到本地(这里不介绍网络途径了,下载就完事了) 然后利用一个网站将这个ttf文件转成base64文件https://trans ...
- 微信小程序中使用iconfont/font-awesome等自定义字体图标
小程序不能识别外部字体文件,但是转换成Base64就可以使用字体图标了. 以阿里巴巴的iconfont为例 1.下载图标 先去官网下载喜欢的图标==> 下载解压后的文件夹==> 2.在线转 ...
- 微信小程序如何使用iconfont阿里巴巴图标库?
步骤: 1.如图先下载: 2.找到iconfont.css改为iconfont.css 3.修改iconfont.wxss文件的内容,如图复制内容至其文件 4.替换到文件页面当中 5.去页面中引入i ...
- 微信小程序内容组件图标 icon
小程序内置了一下图标可以用 需要自定义图标的看这里 ==>微信小程序中使用iconfont/font-awesome等自定义字体图标 小程序内置图标使用示例 <icon type=&quo ...
- 微信小程序项目wx-store代码详解
这篇文章会很长,非常长,特别长,无敌长. 真的是挤牙膏般的项目进度,差不多是8月底有开始这个项目的想法,时至今日都1个多月了,抛去频繁的加班时间,王者时间,羽毛球时间...见缝插针的写这个项目,我竟然 ...
- 微信小程序如何引入外部字体库iconfont的图标
每天学习一点点 编程PDF电子书.视频教程免费下载:http://www.shitanlife.com/code 微信小程序不能识别很多文件, 其中就包括外部的字体文件. 那我们怎么突破他的防火线呢, ...
随机推荐
- Java学习08 (第一遍) - SpringMVC
写一下午的好多居然丢失...自动保存也只是保存丢失后的 那就不多写了,简单写: Spring:(自己画的) 官网的: 写一个Spring的例子: Eclipse http://repo.spring. ...
- Python学习—基础篇之文件操作
文件操作 文件操作也是编程中需要熟练掌握的技能,尤其是在后台接口编写和数据分析过程中,对各种类型的文件进行操作,获取文件信息或者对信息进行存储是十分重要的.本篇博客中将主要对常见的文本格式文件和Exc ...
- input只允许输入正整数
onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=t ...
- 顶级项目孵化的故事系列——Kylin的心路历程【转】
现在已经名满天下的 Apache Kylin,是 Hadoop 大数据生态系统不可或缺的一部分,要知道在 Kylin 项目早期,可是以华人为主的开源团队,一路披荆斩棘经过几年的奋斗,才在 Apache ...
- jq怎么给图片绑定上传文件按钮
html代码 <img src="/img/zhengmian.png" alt="" class="file1"> <i ...
- [leetcode]72. Edit Distance 最少编辑步数
Given two words word1 and word2, find the minimum number of operations required to convert word1 to ...
- Swift 从OC入门
前言:断断续续学了蛮多天的Swift,感触还是蛮多的~~ 1.OC是以C语言为基础的语言,学习之前有C语言的基础,所以对于 `*` 这些指针还是比较容易理解的.问过其他程序员,对OC里面的 `*` 指 ...
- 利用springloaded进行java jar&class的动态替换
之前已经写过一篇关于class的动态替换博客,今天我们来介绍一下如何用springloaded进行jar&class的动态替换. 首先说一下实验过程,结合了目前我正在做的项目,这个项目是一个前 ...
- php 高效日志记录扩展seaslog 的使用
群里交流,听说seaslog不错,此文旨在记录使用. $ wget https://github.com/Neeke/SeasLog/archive/master.zip $ unzip master ...
- ssms创建链接服务器