如何利用iconfont图标代替小图片
1.首先 你要有一个阿里巴巴矢量图这个网站的账号:http://www.iconfont.cn/ 在这里注册哦~
2.蓝后 可以在首页搜索你想要的图标,比如 我想放一个管理员的图标在页面上:

就要点击这个小车车 把你想加的图标添加入库,然后你就可以在右上角的小车里找到它,点击打开然后选择添加到项目。

加入之后 会进入这个界面

3.然后点击查看在线链接,会生成这么一段代码

点此复制代码 复制下来~~
4.然后再定义使用iconfont的样式:
.iconfont{
font-family:"iconfont" !important;
font-size:16px;font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;}
5.最后挑选相应图标并获取字体编码(就是上面小图下面的编码),应用于页面:
<i class="iconfont"></i>
完美。
如何利用iconfont图标代替小图片的更多相关文章
- 如何使用iconfont字体代替小图片?
我们以阿里巴巴矢量图标库举例,地址:http://www.iconfont.cn/ 在这里,你可以上传你的矢量图标,也可以直接使用现成的小图标. 为什么要用这些个图标字体,本文就不介绍了,请自行百度. ...
- CSS Sprite小图片自动合并工具
css-sprite是将css样式中零星的小图标,小图片合并成大图显示,这样能减小服务器并发连接数,减小服务器负载和带宽使用,有很高的实用价值.这里介绍一些自动合并图片并生成样式的工具. NodeJS ...
- 如何使用IconFont字体图标代替网页图片?
一.IconFont的优点 1.轻量性 可以减少http请求,可以配合html5离线存储做性能优化,有利于后期维护. 2.灵活性 可以自由变换IconFont大小(不失真),可以修改IconFont颜 ...
- 利用python3.x实现小爬虫下载贴吧内图片
Hi, I'm back. 寒假在家只有一台笔记本,也懒得把台式机上的键盘拆下来用,因此编程被我暂时搁置,转而在网易云课堂上学了一下Python.可惜的是云课堂的Python教程是基于Python ...
- [Taro] 解决 使用 Taro UI 小程序下 Iconfont 图标 不显示问题
Taro UI 配置 第三方 的 文档 配置即可解决 https://taro-ui.jd.com/#/docs/icon 解决问题: 之前 只有在H5下 才显示 Iconfont 图标 后来按照此文 ...
- 利用dedecms给近三天(或当天)发布的文章显示红色日期或加上new字或new小图片
1)红色日期 <br>[field:pubdate runphp='yes'] <br>$a="<font color=red>".strfti ...
- icon-font图标介绍
前言 像素完美(Pixel Perfection).分辨率无关(Resolution Independent)和多平台体验一致性是设计师们的追求. 可访问性(Accessability).加载性能和重 ...
- compass Sprites 雪碧图 小图片合成[Sass和compass学习笔记]
demo 源码 地址 https://github.com/qqqzhch/webfans 什么是雪碧图? CSS雪碧 即CSS Sprites,也有人叫它CSS精灵,是一种CSS图像合并技术,该方法 ...
- 分享:录制gif小图片工具
今天博主分享一个录制gif小图片的工具[LICEcap]: 有的时候,图片解释起来不够直观,如果是一段小动画,别人一看就懂了. 工具我放在百度网盘上面,当然也可以自己在网上下载. 下载地址:http: ...
随机推荐
- luogu5022 [NOIp2018]旅行 (dfs)
m=n-1的时候,就直接贪心地dfs就可以 m=n的话,就可以枚举删掉一条边,然后照着m=n-1做 $O(n^2)$大概能过 (然而我眼瞎看不到m<=n) #include<cstdio& ...
- linux(fedora) 第三课
树形打印所有进程名:pstree pstree | grep pstree -A2 -B2(查看pstree前后两行) NI的值[-20,20) nice(改变NI的值):改变程序优先级 nice - ...
- CodeForces - 589J(DFS)
题目链接:http://codeforces.com/problemset/problem/589/J 题目大意:一个机器人打扫一个密闭的房间,房间由一个矩形构成,'*'表示家具,'.'表示该位置为空 ...
- Python中何时使用断言 assert
使用断言的最佳时机偶尔会被提起,通常是因为有人误用,因此我觉得有必要写一篇文章来阐述一下什么时候应该用断言,为什么应该用,什么时候不该用. 对那些没有意识到用断言的最佳时机的人来说,Python的断言 ...
- ACM-ICPC 2017 Asia Xi'an A XOR (线性基+线段树思想)
题目链接 题意;给个数组,每次询问一个区间你可以挑任意个数的数字异或和 然后在或上k的最大值 题解:线性基不知道的先看这个,一个线性基可以log的求最大值把对应去区间的线性基求出来然后用线段树维护线性 ...
- Python经典算法片段
将一个正整数分解质因数 #!/bin/env python2 # -*- coding: UTF-8 -*- def reduceNum(n): print '{} = '.format(n), if ...
- luogu3731 新型城市化
题目链接 思路 这道题对于题意的转化很关键. 题目要求的是添上一条边,使得图中最大团的大小变大.给出的边是原图的补集,这就给我们了提示. 因为题目中说,原图中最多有两个团.所以给出的边一定形成了一个二 ...
- PostCSS理解与运用
1.PostCSS是什么 它可以被理解为一个平台,可以让一些插件在上面跑 它提供了一个解析器,可以将CSS解析成抽象语法树 通过PostCSS这个平台,我们能够开发一些插件,来处理CSS.热门插件如a ...
- A*搜索算法
先了解一下什么是A*算法. A*搜寻算法,俗称A星算法.A*算法是用于寻找两点之间的最短路径,同时它也是一种静态路网中求解最短路最有效的直搜索方法.这是一种在图形平面上,有多个节点的路径,求出最低通过 ...
- Luogu P3868 [TJOI2009]猜数字
题目链接 \(Click\) \(Here\) 中国剩余定理的板子.小心取模. #include <bits/stdc++.h> using namespace std; const in ...