如何换ionic里面的图标
(转自http://www.zcool.com.cn/article/ZMTM4NDQw.html)
第一步,你把你的项目的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是.前缀-图标名字{样式},好了赶紧改吧

如何换ionic里面的图标的更多相关文章
- 转:js小技巧 ,将彻底屏蔽鼠标右键,可用于Table ,取消选取、防止复制,IE地址栏前换成自己的图标
1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键<table border oncontextmenu= ...
- ionic 添加应用图标与启动页
由于手机有很多不同的尺寸与版本,所以图标尺寸也是大小不一,但是如果手动每一个尺寸都制作一个图标,那估计美工会吐血吧,不过幸好,ionic只需要一个图标就可以制作不同尺寸的图标. 添加一个ionic项目 ...
- ionic中修改图标的问题
有两种修改图标的方法,一种是手动配置,另外一种是使用命令 1.手动配置 把图标icon.png复制到resources\android\icon目录下 修改根目录的config.xml文件 <p ...
- 替换 ionic 中的 图标
第一步,你把你的项目的SVG文件跟你自己做的图标的SVG文件都上到icomoon.io/app(上传方式上节已经讲过了,不会的翻下上节内容),会看到这么界面 第二步,点击下载后,出现这个页面,修改前缀 ...
- [EasyUI美化换肤]更换EasyUi图标
前言 本篇文章主要是记录一些换EasyUI皮肤的过程,备忘.也欢迎美工大神各路UI给点好意见,EasyUI我就不介绍了,自行百度吧..(So..所以别问我是不是响应式..本身EasyUI就不是响应式. ...
- ionic ios发布图标启动也不能正确加载问题
前两天发布ios的时候发现ios安装的图标和启动页的时候不能正确显示,重新发布也不能正确显示,修改方法 在ionic build ios --release之前执行ionic resources即可
- 换掉Tomcat默认图标
将<Tomcat_home>下的/webapps/ROOT的favicon.ico替换成你自己的图标,名还得是这个名. 然后清除浏览器缓冲,webapp默认的小猫图标就被换掉了. 效果如下 ...
- Ionic 生成icon图标
1.直接切换到项目跟目录 运行以下命令 备注:运行第一次ionic rescoures 后自动生成文件夹rescoures ,让后帮你自己的icon.png 文件放进入就ok ,在次运行ionic r ...
- ionic入门之色彩、图标、边距和界面组件:列表
目录: 色彩.图标和边距 色彩 图标 内边距 界面组件:列表 列表:.list 成员容器:.item .item: 嵌入文本 .item : 嵌入图标 .item : 嵌入头像 .item : 嵌入缩 ...
随机推荐
- Bootstrap<基础九>辅助类
Bootstrap 中的一些可能会派上用场的辅助类. 文本 以下不同的类展示了不同的文本颜色.如果文本是个链接鼠标移动到文本上会变暗: 类 描述 .text-muted "text-mu ...
- 【重要!】告K2老客户书
K2近期升级优化了售后支持系统,以便能更好的为亲爱的老客户们答疑解惑,比如:“老妈和老婆掉水里先救谁”.“中午吃啥晚上吃啥”.“技术男怎么学会撩妹”……这些问题,统统不会告诉你.售后TEAM作为一支专 ...
- shell脚本连接、读写、操作mysql数据库实例
本文介绍了如何在shell中读写mysql数据库.主要介绍了如何在shell 中连接mysql数据库,如何在shell中创建数据库,创建表,插入csv文件,读取mysql数据库,导出mysql数据库为 ...
- hihoCoder#1094
刚开始学习C语言,准备在做hiho的题目的过程中来学习,在此进行记录,如果代码中有错误或者不当的地方还请指正. 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 Littl ...
- 杭电ACM1000
#include <stdio.h> int main() { int a,b; while(scanf("%d%d",&a,&b)!=EOF) { p ...
- Codeforces Round #323 (Div. 1) A. GCD Table
A. GCD Table time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...
- 【转】 Easy RadControl 之 RadGridView(Silverlight)
1.不显示第1列即列指示器(Row Indicators) 在 telerik:RadGridView中设置属性 RowIndicatorVisibility="Collapsed&qu ...
- The guard was taken to hospital in a critical condition.
The Prince George's County Fire Department said the guard was taken to hospital in a critical condit ...
- iOS 修改backBarButtonItem 中的titile 字段
需求如下:A 页面 push 到 B 页面. B 页面中有个返回按钮 不显示A 中的title,而显示 "<返回" ,当然系统的样式还是默认的系统样式.(考虑都是nav ...
- apache 反向代理配置
配置前资料检查: 1.可以使用的apache 安装apache服务:打开cmd , 在apache的bin目录下执行以下命令 httpd -k install -n apache2.2 其中&q ...