Iconfont在项目中的在线使用
来源:互联网 发布:产品优化创新案例 编辑:程序博客网 时间:2024/04/28 21:02
第一次就写点简单的吧~我一开始还在笨头笨脑的下载字体图标的压缩包来用,但是碰上要修改增删某一个图标就要重新下载,十分麻烦。真的是被智商碾压,就知道肯定有可以在线使用的方法~现在就来balabala~哦对...只有使用方法,其他不涉及。
٩̋(ˊ•͈ ꇴ •͈ˋ)و
一、找图标加购物车
不用教吧都会。加购物车,像购物一样,毕竟大TB的库。
二、添加至项目
一般做项目,把需要的图标都存在一个项目文件夹里方便更新使用,而且可以和设计关联账号,我一般是让设计找图标的,直接去使用,毕竟我的眼睛跟设计的眼睛总是存在一些审美误差。
这是新建项目
三、打开我的项目(重点来了)
1.点击生成代码:
2.点击之后打开Font-class:
3.复制这段代码在浏览器打开:
以上这就是在浏览器中打开的代码的样子
4.将@font-face和.iconfont复制粘贴到你的css中
5.在上图位置添加http:即可在线获取
6.在HTML中的使用,复制图标中的代码字段
这里使用的是unicode下的代码。
HTML中:
在包裹字体图标代码的盒子上加class即可。
效果图
四、增删修改
项目中有添加新的字体图标需要使用时,每一次修改,都会生成新的代码,点击生成。
将新生成的@font-face覆盖之前的代码即可。切记要重新添加http:
新添票房图标,刷新覆盖@font-face.
html再次使用。
--------------------------------------------------------------------------------------------------------------------------------------------------------------------
好啦结束了,相比下载压缩包只需要修改一部分代码就可以了,是不是超级方便。
当然大神可以忽略 ଘ(੭ˊᵕˋ)੭* ੈ✩‧₊˚
阅读全文
1 0
- Iconfont在项目中的在线使用
- Iconfont 图标库在Android项目中的使用
- ICONFONT在APP中的使用
- iconfont 在mobile 开发中的使用
- HTML中的iconfont使用
- iconfont在ionic中的使用(阿里图标库)
- iOS项目中使用iconfont
- 在iOS开发中使用iconfont图标
- 在iOS开发中使用iconfont图标
- 在iOS开发中使用iconfont图标
- iconFont在iOS上的使用详解
- iconfont在线链接使用方法
- iconfont使用
- Iconfont图标使用-打造自己项目下…
- 在web开发中使用iconfont字体图标
- ANT 在项目中的使用
- lucene 在项目中的使用
- ldap在项目中的使用
- 基于libVLC的视频播放器(支持RTSP协议)
- VPS自建ss一些坑
- jdbc
- Bootstrap 标签页(Tab)插件
- 计算机网络复习(Ch3数据链路层)
- Iconfont在项目中的在线使用
- 【转】Web系统大规模并发——电商秒杀与抢购
- 判断输入的IP地址是否合法
- eclipse菜单栏图标行消失解决办法
- 2004noip 提高组 合并果子
- C#学习笔记-abstract关键字
- Spark内核源码深度剖析:基于Yarn的两种提交模式深度剖析
- Linux-select多路复用(转载)
- WUST 1482 find clouds(bfs+状态压缩)