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中的说明,创建上图的 ...
随机推荐
- plain framework 1 版本更新 1.0.2 增加打包插件
由于个别因素,该框架的文档没有及时的更新到博客上,但是离线的文档已经完成.本次更新对框架来说显得比较重要,因为在文档的编写过程中经过再次的阅读代码修复了不少错误,最主要的是统一了整个框架的标准风格.对 ...
- copy-paste component
http://www.cnblogs.com/wantnon/p/4579008.html
- [No00001F]阅读速度如何快一点、再快一点?-不知道读啥?试试这些电影剧本!
少侠萌好,还记得包大人给大家推荐过的语感培养大法——“电影剧本阅读法”吗?最近,包大人陆陆续续收到了好几位少侠的实践报告,他们中不少人抱怨:“大人,你明明说过电影剧本篇幅短.用词简单的,可为什么我还是 ...
- python黑客编程之端口爆破
#coding:utf-8 from optparse import OptionParser import time,re,sys,threading,Queue import ftplib,soc ...
- uva131 The Psychic Poker Player
The Psychic Poker Player Time Limit: 3000MS 64bit IO Format: %lld & %llu Description In 5-ca ...
- UIDate(时间)
1.时间与时间的比较 ["时间1" timeIntervalSinceDate:"时间2"] >= 0;
- 【HTML5+MVC4】xhEditor网页编辑器图片上传
准备工作: 创建一个MVC项目中,添加好xhEditor插件 相关用法:http://www.cnblogs.com/xcsn/p/4701497.html 注意事项:xhEditor分为v1.1.1 ...
- ASP.NET中处理自定义错误的最佳方式
要在ASP.NET中处理好自定义错误(Custom Errors)首先要抛弃使用web.config\customErrors. <customErrors mode="RemoteO ...
- document.elementFromPoint在IE8下无法稳定获取当前坐标元素的解决方法
document.elementFromPoint(e.clientX, e.clientY) document.elementFromPoint(e.clientX, e.clientY) 执行2次 ...
- [转]C#压缩打包文件
/// <summary> /// 压缩和解压文件 /// </summary> public class ZipClass { /// <summary> /// ...