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 使用图标字体来美化按钮)的更多相关文章

  1. ExtJs5_使用图标字体来美化按钮

    sencha 的例子中,有使用图标字体来美化按钮的例子,这个用起来又方便风格又统一,例如下图: 上面图标字体的使用方法也很简单,只要下载Font Awesome的css和图标文件,放到项目里就可以了. ...

  2. 5、手把手教你Extjs5(五)使用图标字体来美化按钮)

    sencha 的例子中,有使用图标字体来美化按钮的例子,这个用起来又方便风格又统一,例如下图: 上面图标字体的使用方法也很简单,只要下载Font Awesome的css和图标文件,放到项目里就可以了. ...

  3. extjs基础 使用图标字体来美化按钮)

    下载 Font Awesome 1.拷贝css 和 fonts 到build同级目录 2.需要在index.html中引入css文件 3.在main.js文件中添加 initComponent : f ...

  4. 图标字体的使用(fontello.com)字体推荐及使用技巧

    网页设计中为了页面漂亮好看,图标是少不了,网页中使用的图标通常都是使用图片,使用图片图标的有很多弊端,如果你经常制作网页应该有一肚子埋怨. 使用图片图标的弊端 放大图标必须重新作图, 改变颜色必须开启 ...

  5. iocfont 网页图标字体以及使用方法

    在网页设计中使用图标字体(icon font)是件挺有新意的事情,使用图标字体能我们带来了一定的方便,比如在移动设备.Retina屏幕效果展示.兼容IE6/7浏览器以及能任意将图标放大缩小等,这些都是 ...

  6. CSS高级技巧 图标字体ICONFONT的使用方法视频

    图标字体  iconfont 这是一种字体,它跟svg 有很大 相似点   它是矢量的,放大缩小不失真的.很且很小. 我们把它成字看来. 字体 在 从ie4就开始支持的.  兼容性很好 唯一麻烦的地方 ...

  7. (转载)app ico图标字体制作

    图标字体化浅谈   在做手机端Web App项目中,经常会遇到小图标在手机上显示比较模糊的问题,经过实践发现了一种比较好的解决方案,图标字体化.在微社区项目中,有很多小的Icon(图标),如分享.回复 ...

  8. 第一次制作和使用图标字体-IcoMoon

    开题:之前就有所耳闻,最近两天第一次运用到图标字体.刚开始嘛,一脸懵逼的状态.成功运用之后就来记录一下使用过程咯! 1. 打开在线生成工具:https://icomoon.io/app/#/selec ...

  9. 01_MUI之Boilerplate中:HTML5示例,动态组件,自定义字体示例,自定义字体示例,图标字体示例

     1安装HBuilder5.0.0,安装后的界面截图如下: 2 按照https://www.muicss.com/docs/v1/css-js/boilerplate-html中的说明,创建上图的 ...

随机推荐

  1. Nova: 虚机的块设备总结 [Nova Instance Block Device]

    和物理机一样,虚拟机包括几个重要的部分:CPU.内存.磁盘设备.网络设备等.本文将简要总结虚机磁盘设备有关知识. 1. Nova boot CLI 中有关虚机块设备的几个参数 nova boot CL ...

  2. ios移动端切图及前端规范

    移动端IOS知识普及:IOS标准分辨率:1242px * 2208px 切片要求: 1.    设计稿是按标准分辨率1242X2208设计,图片资源尺寸则是3倍图尺寸,将整个设计图压缩成750X133 ...

  3. CF687C. The Values You Can Make[背包DP]

    C. The Values You Can Make time limit per test 2 seconds memory limit per test 256 megabytes input s ...

  4. POJ1270 Following Orders[拓扑排序所有方案 Kahn]

    Following Orders Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 4885   Accepted: 1973 ...

  5. 创建简单的机器人模型smartcar

    前面我们使用的是已有的机器人模型进行仿真,这一节我们将建立一个简单的智能车机器人 smartcar,为后面建立复杂机器人打下基础. 一.创建硬件描述包. cd ~/catkin_ws/srcroscr ...

  6. [No000047]好的架构源于不停地衍变,而非设计

    对很多创业公司而言,随着业务增长,网站的流量也会经历不同的阶段.从十万流量到一百万流量,再从一百万流量跨越到一千万甚至上亿的流量,网站的架构需要经历哪些变化?在"OneAPM 技术公开课&q ...

  7. 一个简单的Android富文本TextView实现

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 24.0px Helvetica; color: #555555 } p.p2 { margin: 0.0p ...

  8. (转载)ORA-14452:试图创建,更改或删除正在使用的临时表中的索引

    因为表kol_xx_fin050_temp 为临时表,而且有其他session正在使用. 处理步骤: 1.先从 dba_objects / user_objects中查询到该表的object_id: ...

  9. 关于MyBatis mapper的insert, update, delete返回值

    这里做了比较清晰的解释: http://mybatis.github.io/mybatis-3/java-api.html SqlSession As mentioned above, the Sql ...

  10. WIN7下强制分第四个主分区的方法

    通过磁盘管理的界面方式, 第四个分区会被分成扩展分区, 建议通过命令行 打开命令行运行diskpart, list disk 会列出所有磁盘, 选择要操作的磁盘序号如1,select disk 1 如 ...