当前位置: 首页 > 编程日记 > 正文

微信小程序使用阿里巴巴iconfont字体图标

  1. 打开阿里巴巴iconfont官网(http://www.iconfont.cn/);

  2. 把用到的字体图标加到项目里面;

  3. 进入到项目里面,选择font class方式来使用,如果没有生成过代码的同学点生成,已经有代码的直接复制代码;
    img_ba38e00aebbb0514ab37430e3bdc3514.png
    iconfont.png
    img_860595ee1c0a8066c3456e796e09d170.png
    iconfont.png

4.浏览器新建页面,把复制的代码粘贴到地址栏,回车。然后全选页面的内容,复制;
img_0d7be31e99985de0ab6b8bead9a91593.png
image.png

5.把复制的页面内容粘贴到项目的app.wxss文件(粘贴到app.wxss,项目里的每个页面都能使用,如果只是某一个页面用到的话,也可以粘贴到对应页面的wxss文件);
img_49c2205afa4e7cd4f75eb3376599e227.png
image.png

6.使用某个字体图标。把鼠标悬浮到要使用的字体图标上面,然后点复制代码,或者直接复制字体图标的类名(没留意过叫什么,应该是叫类名吧)。然后到项目要使用字体图标页面的wxml,用个微信小程序支持的行内标签(我用的是<i>),把类名粘贴上去就OK啦!

<view><i class="iconfont icon-feiji2" style="font-size: 100px; color: red;" /><text>我是字体图标,飞机</text>
</view>
img_9958ce1e50a6fbfe02f2115d7cb7d16a.png
image.png
img_c8dac8893bf34f6256d4295f38674409.png
iconfont
  1. 效果图
    img_ab2585eafa9f5b24cb525b9edb750927.png
    image.png
好啦,本宝宝要去撸代码去啦!!!

相关文章:

IIS6 MVC3 配置

用mvc3做了一个网站&#xff0c;重写了下URL&#xff0c;http://www.xxxx.com/news/details/54.html. 结果在iis上预览找不到页面&#xff0c;但是在vs下就没问题直接运行就没问题。 具体的原因应该是找不到映射。 所以需要在iis上添加映射。 添加MVC的解析&#xff1a; 右击II…

【组队学习】【27期】动手学数据分析

动手学数据分析 论坛版块&#xff1a; http://datawhale.club/c/team-learning/25-category/25 开源内容&#xff1a; https://github.com/datawhalechina/hands-on-data-analysis 学习目标 以项目为主线&#xff0c;通过边学&#xff0c;边做以及边被引导的方式&#xf…

参加UI培训后可以找什么工作

UI设计在近几年备受大家的关注&#xff0c;很多企业对UI设计这个岗位也显得尤为重要&#xff0c;很多人都想转型学习UI设计技术&#xff0c;大多数人选择参加UI培训机构进行系统学习&#xff0c;那么通过系统培训的同学参加UI培训后可以找什么工作呢?来看看下面的详细介绍。 参…

Datawhale组队学习周报(第021周)

本文总结了本周&#xff08;07月05日~07月11日&#xff09;Datawhale组队学习的运行情况&#xff0c;我们一直秉承“与学习者一起成长的理念”&#xff0c;希望这个活动能够让更多的学习者受益。 第 25 期组队学习一共有 3 门开源课程&#xff0c;共组建了 3 个学习群&#xf…

alias重启终端失效的问题

如果使用命令 alias xxxxxx 那么登出以后&#xff0c;别名就会失效。下次登入的时候就不能用了。 为了保持别名可以把它写入.bashrc 在.bashrc的最后写入想要的别名&#xff0c;比如 alias zpll -al 然后退出&#xff0c;重新登入的时候就可以用了。 或者直接运行命令 source ~…

使用文本用户界面(NMTUI)进行网络配置

NetworkManager 文本用户界面&#xff08;TUI&#xff09;工具 nmtui 可提供一个文本界面配置由 NetworkManager 控制的网络。该工具包含在 NetworkManager-tui 子软件包中。写入时&#xff0c;不会默认随 NetworkManager 安装该子软件包。要安装 NetworkManager-tui&#xff0…

UI培训教程分享:常用的商业插画风格有哪些?

在UI设计岗位中插画设计是作为一名合格的UI设计师都会接触到的工作内容&#xff0c;运用插画设计&#xff0c;做到图文结合&#xff0c;令用户的印象也更加深刻&#xff0c;今天小编为大家分享的UI培训教程就是关于常用的商业插画风格有哪些?希望能够给大家带来帮助。 UI培训教…

快速构建Windows 8风格应用32-构建辅助磁贴

引言 Windows Phone中&#xff0c;我们开发者可能会开发的一个功能点是将数据列表中某一项“Pin To Start(固定到开始屏幕)”&#xff0c;大家都知道这种固定到开始屏幕的磁贴叫做辅助磁贴&#xff08;也叫二级磁贴&#xff09;&#xff0c;用户可以通过该辅助磁贴启动应用程序…

【第22周复盘】可以查成绩了!

「青少年编程竞赛交流群」已成立&#xff08;适合6至18周岁的青少年&#xff09;&#xff0c;公众号后台回复【Scratch】或【Python】&#xff0c;即可进入。如果加入了之前的社群不需要重复加入。 微信后台回复“资料下载”可获取以往学习的材料&#xff08;视频、代码、文档&…

UI培训教程分享:APP启动页UI界面设计

本期为大家分享的ui培训教程是关于APP启动页面的UI设计方面&#xff0c;作为一名合格的UI设计师&#xff0c;APP产品的启动页是需要会的&#xff0c;下面就来看看详细的教程吧。 UI培训教程分享&#xff1a;APP启动页UI界面设计 启动页面在APP中还是很有必要的&#xff0c;对于…

Nginx 配置

content_by_lua ‘’&#xff1b; set_by_lua $c "return ngx.var.a ngx.var.b"; rewrite_by_lua "ngx.var.a ngx.var.a 1"; access_by_lua if ngx.var.remote_addr "127.0.0.1" thenreturnendngx.exit(403);虚拟主机 server_name .a.org; …

cd: mkdir: rmdir: rm

1、1 绝对路径和相对路径绝对路径&#xff1a;是指在目录下的绝对位置&#xff0c;直接到的目标位置例如&#xff1a;只要看到这个路径&#xff1a;D&#xff1a;\图片\徐慧茹.jpg"文件是在D盘的“图片”目录中。类似这样完整的描述文件的路径就是绝对路径。相对路径&…

【Whalepaper】CV论文研读 - Involution内卷:超越Convolution的新算子

Whalepaper是由周郴莲负责的一个每周分享论文的活动&#xff0c;带你研读AI领域的论文&#xff0c;快来一起开源学术科研吧&#xff01; NLP 论文分享&#xff1a;每周日 晚上 九点CV 论文分享&#xff1a; 每周日 晚上 九点Res 论文分享&#xff1a;每周六 晚上 九点半 欢迎…

UI培训分享:UI设计师要掌握哪些知识点

UI设计师除了要学会自己所在行业的技术之外&#xff0c;还要了解一些其他的知识点&#xff0c;这些知识点都会在今后的工作中带来帮助&#xff0c;甚至是加分项&#xff0c;那么下面来看看小编为大家介绍的UI培训分享&#xff1a;UI设计师要掌握哪些知识点? UI培训分享&#x…

JavaScript 关闭窗口事件

方式一&#xff1a;(适用与IE浏览器&#xff0c;而且刷新不提示&#xff0c;只在点击浏览器关闭按钮的时候提示) <script type"text/javascript"> window.οnbefοreunlοadonclose; function onclose() { if(event.clientX>document.body.clientWidth&…

【直播】闫强:文本分类上分利器 -- Bert微调技巧大全

文本分类上分利器 – Bert微调技巧大全 直播信息 主讲人&#xff1a;ChallengeHub成员&#xff0c;中国人民大学硕士。 直播时间&#xff1a;2021年07月25日 15:00~16:00 直播内容&#xff1a; 经典论文介绍与解读模型继续预训练实现交流&答疑 直播网址&#xff1a; …

计算机基础第二课时

文件后缀名 1.也称文件扩展名(filename extension) 2.是操作系统用来标志文件类型的一种机制 3.通常来说&#xff0c;一个扩展名是跟在主文件名后面的&#xff0c;由一个分隔符分隔。例如&#xff1a;“前端开发知识要点.txt”的文件名中&#xff0c;前端开发知识要点是主文件名…

ui培训教程分享:平面设计怎样视觉空间感?

本期UI培训教程为大家分享的是关于平面设计怎样视觉空间感?在UI设计岗位中&#xff0c;视觉空间感对于设计师来说是非常重要的&#xff0c;所谓空间&#xff0c;是指立体形态周围的空虚部分&#xff0c;空间是无限的。任何空间形态的建立都必须借助立体形态来表达&#xff0c;…

Android组件框架:Android组件管理者ActivityManager

关于作者 郭孝星&#xff0c;程序员&#xff0c;吉他手&#xff0c;主要从事Android平台基础架构方面的工作&#xff0c;欢迎交流技术方面的问题&#xff0c;可以去我的Github提issue或者发邮件至guoxiaoxingse163.com与我交流。 第一次阅览本系列文章&#xff0c;请参见导读&a…

[转]HTTP协议详解

当今web程序的开发技术真是百家争鸣&#xff0c;ASP.NET, PHP, JSP&#xff0c;Perl, AJAX 等等。 无论Web技术在未来如何发展&#xff0c;理解Web程序之间通信的基本协议相当重要, 因为它让我们理解了Web应用程序的内部工作. 本文将对HTTP协议进行详细的实例讲解&#xff0c;内…

【Whalepaper】NLP论文研读 - Keyword-Attentive Deep Semantic Matching

Whalepaper是由周郴莲负责的一个每周分享论文的活动&#xff0c;带你研读AI领域的论文&#xff0c;快来一起开源学术科研吧&#xff01; NLP 论文分享&#xff1a;每周日 晚上 九点CV 论文分享&#xff1a; 每周日 晚上 九点Res 论文分享&#xff1a;每周六 晚上 九点半 欢迎…

web前端的就业前景好不好

web前端的就业前景好不好?一直有人都想知道这个答案&#xff0c;其实放眼互联网未来&#xff0c;web前端的发展前景都是非常好的&#xff0c;那么它的就业前景自热也是不错&#xff0c;具体来看看下面的详细介绍就知道了。 web前端的就业前景好不好?近几年的热门行业里&#…

android:HTTP通信 .

HTTP&#xff1a; 超文本传送协议&#xff08;hypertext transport protocol&#xff09;&#xff0c;用于传送WWW方式的数据。属于应用层的面向对象的协议。HTTP采用了请求/响应模型。客户端向服务器发送的请求包含了&#xff1a;请求的方法、URL、协议版本、请求修饰符、客户…

【青少年编程】【三级】打气球游戏

「青少年编程竞赛交流群」已成立&#xff08;适合6至18周岁的青少年&#xff09;&#xff0c;公众号后台回复【Scratch】或【Python】&#xff0c;即可进入。如果加入了之前的社群不需要重复加入。 微信后台回复“资料下载”可获取以往学习的材料&#xff08;视频、代码、文档&…

(转)如何修改maven的默认jdk版本

背景&#xff1a;在maven的配置文件中配置编译的jdk插件&#xff0c;就不需要在eclipse中进行重新的指定了。 问题 1、创建maven项目的时候&#xff0c;jdk版本是1.5版本&#xff0c;而自己安装的是1.7或者1.8版本。 2、每次右键项目名-maven->update project 时候&#xff…

Python适合初学者或者0基础学习吗?

Python适合初学者或者0基础小白学习吗?很多人都比较关注这个问题&#xff0c;因为近几年Python在互联网行业的发展显而易见&#xff0c;它的就业几率也非常高&#xff0c;具体来看看下面的详细介绍吧。 Python适合初学者或者0基础小白学习吗?与Java、C不同的是&#xff0c;Py…

CS5中动作和批处理

动作类似office里的宏。 窗口---动作。排列过多的图片可以窗口---排列。 先新组&#xff0c;然后新动作&#xff0c;完成后停止录制&#xff1b;点击新图片使其成为当前图片&#xff0c;再点击播放动作。 一个新组下可以有很多动作。 动作定义为快捷键&#xff0c;使用时可以双…

Django模板过滤器详解

Django 模板过滤器也是我们在以后基于 Django 网站开发过程中会经常遇到的&#xff0c;如显示格式的转换、判断处理等。以下是 Django 过滤器列表&#xff0c;希望对为大家的开发带来一些方便。 一、形式&#xff1a;小写   {{ name | lower }} 二、串联&#xff1a;先转义文…

【青少年编程】【三级】 魔术表演“开花”

「青少年编程竞赛交流群」已成立&#xff08;适合6至18周岁的青少年&#xff09;&#xff0c;公众号后台回复【Scratch】或【Python】&#xff0c;即可进入。如果加入了之前的社群不需要重复加入。 微信后台回复“资料下载”可获取以往学习的材料&#xff08;视频、代码、文档&…

Python培训教程分享:visual studio编写python怎么样?

本期小编要为大家介绍的Python培训教程就是关于“visual studio编写python怎么样?”的问题&#xff0c;但答案当然是可以的&#xff0c;据了解&#xff0c;vs2017、vs2019都集成了python开发&#xff0c;只不过需要在安装的时候单独勾选一下才行&#xff0c;下面小编简单介绍一…