如何换ionic里面的图标
不说废话直入正题
第一步，你把你的项目的SVG文件跟你自己做的图标的SVG文件都上到icomoon.io/app（上传方式上节已经讲过了，不会的翻下上节内容），会看到这么界面
第二步，点击下载后，出现这个页面，修改前缀，文件的名称
第三步，修改每个图标的名称，size值然后点击下载
我做的是安卓的APP所以修改的名字也是按照我自己的来的，你们也按照你们自己的来
第四步，下载下来的文件名字为icomoon压缩包，解压后应该是这样
第五步重点来了，要注意呀，在你的项目里面找到fonts，把你下载下来的fonts文件覆盖到这个里面记得名字要一致
第六步打开您icomoon文件的style.css
第七步，看到这么个界面
第八步，在你的项目里面找到ionic.css文件
第九步，打开
第十步，修改eot文件名称，如果名称一致就不用修改了；切记把我红框里面的SRC得修改了；
第十一步，把你生成的图标样式替换了原有的，有人问什么是图标的样式，看下面的图就知道了
第十一步，保存下就可以看到你自己的图标了，再往下，我不知道这些是干嘛用的，但是介于跟图标有关系，所以我们就接着换，跟我一起来，找到_ionicons-font.scss，
第十二步打开修改吧，相信您一定比我聪明
第十三步，找到这个_ionicons-icons.scss
第十四步，继续修改，发现什么规律了吗？这个就是咱们的图标命名，赶紧改吧
第十五步找到_ionicons-variables.scss
第十六步，就这么任性，继续修改，两个地方要修改，一个是前缀，如果跟第二步中写的前缀一样就不用修改了，另个修改的地方有点坑爹，$ionicon-var-android-car: "\e602";对照咱们下载的style里面的发现规律了吧，它这个是$ionicon-var-图标名字:图标样式；咱们的style是.前缀-图标名字{样式}，好了赶紧改吧
东西写的有点赶脚，有不懂的地方或是不对的地方大家可以告诉我
可以参照这个文档来进行修改 http://download.csdn.net/detail/findsafety/9127337
需要用到的文件有3个
1 fonts文件夹下面的所有文件
2 style.css
3 demo-files文件夹下面的demo.css
只有上面几个都完整的时候，才能正常使用到SVG图标
另外一点，自己制作的SVG图标可能会出现在https://icomoon.io/app/#/select上传完成的时候发现是一片空白，原因在于SVG图片制作不符合要求，详情见http://www.zhihu.com/question/24513579
如何换ionic里面的图标相关推荐
- app屡次停止运行怎么解决_解决换完安卓客户端图标和名字后出现停止运行
在前面的第五节帮主跟大家分享了怎么更换图标和名字,但是换好了已经,在从新打开会提示:很抱歉,帮手游已停止运行,然后就没有了,这个错误怎么解决呢?原因很多,主要的是在编译之前,APK文件里面有解密的内容 ...
- Python如何打包exe文件？如何换成喜欢的图标？
前言 嗨喽,大家好呀~这里是爱看美女的茜茜呐 今天又想来分享一个Python打包exe文件的教程!!这次是最强终极版~~~~ 在我们代码写好后,分享给不会编程的朋友时,总会遇到许许多多的的问题 这个时 ...
- ionic：引入图标
在添加ionic框架后,如果需要使用内置资源库,需要在angular.json如下声明
- Python如何打包exe文件? 如何换成喜欢的图标?
要将Python脚本打包为可执行的exe文件,可以使用第三方库pyinstaller.以下是将Python脚本打包为可执行exe文件的步骤: 1.安装pyinstaller:在命令行中使用以下命令安装 ...
- ionic自定义图标（ion-icon）
背景 ionic自带图标库有限,不能满足项目里面各种图标,需要自定义图标. 开始 下载图标库 从iconfont.cn上面搜索想要的图标,添加入库(也就是购物车那个图标) 添加到项目里面,一个项目肯定 ...
- ionic项目相关的操作命令
更新npm D:\Program Files\npm-3.9.0\npm node cli.js install npm -gf vs安装 更新node.js windows版直接从官网下载安装包 ...
- sqlserver 字段中只有年月 加上中文年月_PowerBI 10月更新，全新图标正式亮相
2020年10月更新后,PowerBI新的图标正式来到我们面前:其实前一段已经在很多场合看到过这个新的图标,只是PowerBI Desktop中还没有切换过来,伴随着这次更新,PowerBI的启动界面 ...
- 如何解决IE地址栏前小图标不显示问题
步骤: 一.可用PS软件制作一个图标文件,大小为16*16像素. 二.将制作好的图片提交给可在线生成16*16像素的ico图标的网站,如 http://www.graphicsguru.com/fav ...
- hbuilder新建web apk项目_【CUCS】Ionic利用你喜欢的(html css js) web技术创建跨平台的移动app...
点击上方"CUCS" 可以订阅哦! Ionic 是一个强大的 HTML5 应用程序开发框架,号称 Advanced HTML5 Hybrid Mobile AppFramework ...
最新文章
- mongoDB 文档操作_改
- 调多大的角度 计算几何
- PHP解决shell_exec has been disabled for security reasons
- 【Redis】18.缓存预热、缓存雪崩、缓存击穿、缓存穿透、性能指标监控等企业级解决方案
- Http Core学习（Http Components 翻译和学习）
- Failed to start bean ‘documentationPluginsBootstrapper‘；
- Python多线程实例
- Activity工作流
- C语言运行时间过长假死,解决xcode打开时loading假死的问题
- 关于Redmi显示器（1A 23.8英寸）的亮度如何调节
- 管理科学基础知识__后悔值计算
- hive3.0使用问题小记
- 如何锁定计算机硬盘,详细教您如何给硬盘加密
- 【2020省选模拟】题解
- java 利用openOffice实现word ppt 等资源转化为pdf文件
- 智能晾衣杆_晾衣绳社交书签–仅CSS的社交书签教程
- 学院后勤保修系统php源码,适用于学校后勤报修的微信报修系统
- 股票数据抓取接口文章转载
- 360卫士携手“全家桶”入住UOS 应用商店
- 计算机网络实验四：应用层和传输层协议分析（PacketTracer）