阿里巴巴矢量图标引用问题
来源:互联网 发布:矢量动画软件 编辑:程序博客网 时间:2024/06/06 04:34
第一步:
摒弃之前的先从图标库下载源代码,再引入font样式到自己的项目中的步骤,换作如下步骤操作即可。
之前新建的font文件夹,可以删掉了。
新的引入图标方法:
1. 挑选所需图标,加入购物车
2.选择 ——> 添加至项目:
如果之前没有项目,点击右上角的 + 号按钮,新建一个 任意项目即可:
3.此时,购物车里的图标已经添加到项目里了
4.点击生成代码,即可生成下图红色方框中的代码,将此代码复制到自己本地新建的iconfont.css 文件中:
5.将鼠标放到 需要引入的图标上,点击复制代码:
6.将复制到的字体图标代码粘帖到自己要显示的网页中:
查看效果,手机图标已经引用过来:
7.此时,若想要添加其它新的图标,直接添加到之前在线新建的项目中即可,添加完成之后,它会提示,你有新的图标添加,会让你更新代码,也就是我们本地文件引入的css代码:
点击更新代码后,将代码复制到本地的iconfont.css文件中,将之前的css文件覆盖重写,此时再引入新添加的图标,便可完美引入,不会对之前引入的图标造成影响。
阅读全文
0 0
- 阿里巴巴矢量图标引用问题
- 阿里巴巴矢量项目图标制作流程
- Iconfont怎么用,阿里巴巴矢量图标网
- MUI添加自定义icon图标 阿里巴巴矢量图标
- webpack vue 使用阿里巴巴矢量网svg图标
- 新版Iconfont-阿里巴巴矢量图标库支持三种引用方式
- 引用阿里巴巴(iconfont)字体图标
- 制作自定义图标字体,html引用web svg矢量字体
- 阿里巴巴矢量图标库
- Iconfont-阿里巴巴矢量图标库
- 阿里巴巴矢量图标库
- 阿里巴巴矢量图标库使用
- 阿里巴巴矢量图标库
- 阿里巴巴矢量图标库
- 2017 阿里巴巴矢量图标库 导入所选图标到jsp页面步骤
- 利用阿里巴巴的矢量图片库工具网站制作自己的图标字体
- 阿里巴巴图标
- Twitter Boostrap 矢量图标
- 兄弟连学python-基础知识
- Linux(Ubuntu)安装和完美卸载mysql详细教程
- rabbitmq 参禅
- 33复杂美CEO吴思进:区块链在保险业的应用
- mnist初探
- 阿里巴巴矢量图标引用问题
- 使用MyBatis Generator自动生成实体、mapper和dao层
- LeetCode Remove Nth Node From End of List
- [XAMPP]Tomcat Started/Stopped with errors, return code: 1
- SpringMVC使用
- html打开时头部出现“为了帮助保护您的安全,您的Web浏览器已经限制此文件显示可能访问你的计算机的”
- [DP/贪心] HDU 1257
- 写给前端入门者的chat
- JavaScript基础(4)—— typeof、instanceof操作符和constructor属性