Extjs 使用图标字体来美化按钮)
1. 使用Font Awesome,下载地址http://www.bootcss.com/p/font-awesome/#icons-new
2. 把font和css目录放到 Ext的app目录下面
3. 在index.html中加载
<!-- 引入Font Awesome的css文件 -->
<link type="text/css" rel="stylesheet" href="css/font-awesome.css">
4. 在main.js中设置
initComponent : function() {
Ext.setGlyphFontFamily('FontAwesome'); // 设置图标字体文件,只有设置了以后才能用glyph属性
this.callParent();
}
5.使用
{
text : '搜索',
iconCls : 'icon-search' //这个按钮要到http://www.bootcss.com/p/font-awesome/#icons-new 这个网站去找相应的值
}, {
text : '设置',
glyph : 0xf0c9 // 这个是用 'icon-search' 到css目录下面的font-awesome.css中去找对应的字符串,记住content的值,在前面加入一个0x并把 \符号去掉就可以了
}
Extjs 使用图标字体来美化按钮)的更多相关文章
- ExtJs5_使用图标字体来美化按钮
sencha 的例子中,有使用图标字体来美化按钮的例子,这个用起来又方便风格又统一,例如下图: 上面图标字体的使用方法也很简单,只要下载Font Awesome的css和图标文件,放到项目里就可以了. ...
- 5、手把手教你Extjs5(五)使用图标字体来美化按钮)
sencha 的例子中,有使用图标字体来美化按钮的例子,这个用起来又方便风格又统一,例如下图: 上面图标字体的使用方法也很简单,只要下载Font Awesome的css和图标文件,放到项目里就可以了. ...
- extjs基础 使用图标字体来美化按钮)
下载 Font Awesome 1.拷贝css 和 fonts 到build同级目录 2.需要在index.html中引入css文件 3.在main.js文件中添加 initComponent : f ...
- 图标字体的使用(fontello.com)字体推荐及使用技巧
网页设计中为了页面漂亮好看,图标是少不了,网页中使用的图标通常都是使用图片,使用图片图标的有很多弊端,如果你经常制作网页应该有一肚子埋怨. 使用图片图标的弊端 放大图标必须重新作图, 改变颜色必须开启 ...
- iocfont 网页图标字体以及使用方法
在网页设计中使用图标字体(icon font)是件挺有新意的事情,使用图标字体能我们带来了一定的方便,比如在移动设备.Retina屏幕效果展示.兼容IE6/7浏览器以及能任意将图标放大缩小等,这些都是 ...
- CSS高级技巧 图标字体ICONFONT的使用方法视频
图标字体 iconfont 这是一种字体,它跟svg 有很大 相似点 它是矢量的,放大缩小不失真的.很且很小. 我们把它成字看来. 字体 在 从ie4就开始支持的. 兼容性很好 唯一麻烦的地方 ...
- (转载)app ico图标字体制作
图标字体化浅谈 在做手机端Web App项目中,经常会遇到小图标在手机上显示比较模糊的问题,经过实践发现了一种比较好的解决方案,图标字体化.在微社区项目中,有很多小的Icon(图标),如分享.回复 ...
- 第一次制作和使用图标字体-IcoMoon
开题:之前就有所耳闻,最近两天第一次运用到图标字体.刚开始嘛,一脸懵逼的状态.成功运用之后就来记录一下使用过程咯! 1. 打开在线生成工具:https://icomoon.io/app/#/selec ...
- 01_MUI之Boilerplate中:HTML5示例,动态组件,自定义字体示例,自定义字体示例,图标字体示例
1安装HBuilder5.0.0,安装后的界面截图如下: 2 按照https://www.muicss.com/docs/v1/css-js/boilerplate-html中的说明,创建上图的 ...
随机推荐
- js实现打开网页自动弹出添加QQ好友邀请窗口
我们有时进一些网面或专题页面会自动弹出一个加为好友的对话框了,在研究了很久之后发现可以直接使用js来实现,下面我们一起来看js实现打开网页自动弹出添加QQ好友邀请窗口的方法. 第一步.JS脚本 这个是 ...
- var 0bj = []声明报错的小问题
闲来无事,找了份javascript的习题来作作,结果第一题的答案就难住了,附原题: Javascript中, 以下哪条语句一定会产生运行错误? 答案( B ) A.var _变量=N ...
- Codeforces 687B. Remainders Game[剩余]
B. Remainders Game time limit per test 1 second memory limit per test 256 megabytes input standard i ...
- 配置WebSite的IIS时遇到的问题与解决方法
http://www.cnblogs.com/mingmingruyuedlut/archive/2011/11/04/2235630.html#commentform
- Redis的安装和使用
Redis 安装redis: 将将要安装redis文件夹放到一个盘中 通过命令行切换到放文件的地方 安装成功后,将文件夹中的扩展放入wamp/php/ext中,然后配置php.ini,重启服务器. 使 ...
- 解决为什么每次打开Eclipse新的workspace需要更新nexus-maven-repository-index问题
解决为什么每次打开Eclipse新的workspace需要更新nexus-maven-repository-index问题 新建一个Eclipse的workspace. 打开Window—>Pr ...
- [No000055]教你早晨清肠、除口臭、色斑、大肚腩
[长生不老的秘诀] 释.道.医三家有个共同的秘诀:"要叫人不死. 肠中须无屎". 佛家除要求人们戒杀吃素外,还认为早饭是天食,中饭是人食,晚饭是鬼食. 因此,为了身体健康,不妨碍修 ...
- Eclipse启动时选择workspace设置
由于一直习惯eclipse中只使用一个工作空间,所以一般在eclipse刚刚安装好后第一次启动时,我就钩上了弹出的工作空间选择的对话框中以后不再提示的钩选. 结果这次突然需要用到它的工作空间提示功能了 ...
- Android测试之Monkey
自己用的测试 C:\Users\Star>adb shell monkey -p com.cmstop.android --monitor-native-crashes -- pct-touch ...
- Android之监听手机软键盘弹起与关闭
背景: 在很多App开发过程中需要在Activity中监听Android设备的软键盘弹起与关闭,但是Android似乎没有提供相关的的监听API给我们来调用,本文提供了一个可行的办法来监听软键盘的弹起 ...