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. [译] 企业级 OpenStack 的六大需求(第 2 部分):开放架构和混合云兼容

    全文包括三部分: 第一部分:API 高可用和管理以及安全模型 第二部分:开放架构和混合云兼容 第三部分:弹性架构和全球交付 在本系列的第一部分,我介绍了企业级 OpenStack 的六大需求.现在,我 ...

  2. dp88dp6最靠谱的网络赚钱方法

    (本文非原创,转载自http://mt.sohu.com/20160131/n436463696.shtml) 1.卖产品 最靠谱的当然是自己卖产品,可以先去淘宝.阿里巴巴.百度找到一款你认为有前景的 ...

  3. opencv源码阅读之——iOS的两条接口UIImageToMat()和MatToUIImage()

    本文为作者原创,未经允许不得转载:原文由作者发表在博客园: http://www.cnblogs.com/panxiaochun/p/5387743.html 在ios下开发基于opencv的程序时经 ...

  4. Canon

    .打开压缩包发现2个文件,1个是加密的zip.zip,另一个是music.mp3.猜测zip.zip的解压密码隐藏在music.mp3里 .用MP3Stego解密music.mp3,密码就是标题的Ca ...

  5. Shell脚本语法

      索引 1. 第一行必须是"#!/bin/sh" 2. 注释:一行开头为 # 3. 定义变量 4. 逻辑符号 5. 接收参数 6. 控制流:if/then/elif/else/f ...

  6. M3U8格式讲解及实际应用分析

    M3U8格式讲解及实际应用分析 M3U8有啥好处 ? 网上搜索了一下,大家众说纷纭,个人理解主要是可以做多码率的适配,根据网络带宽,客户端会选择一个适合自己码率的文件进行播放,保证视频流的流畅. 在I ...

  7. 离线安装 Cloudera ( CDH 5.x )

    要配置生产环境前,最好严格按照官方文档/说明配置环境.比如,官方说这个安装包用于RETHAT6, CENTOS6,那就要装到6的版本下,不然很容易出现各种各样的错. 配置这个CDH5我入了很多坑,最重 ...

  8. ASP.NET 小白从零开始建站简易教程 (一)域名、虚拟主机、FTP上传文件

    只考虑性价比,纯新手实验无备案.跟着步骤走半小时即可收获独立的个人网站一枚! 我的实验站 http://www.bearlab.site/ ⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄ 目前总价花费86元(域名加虚 ...

  9. Node 进阶:express 默认日志组件 morgan 从入门使用到源码剖析

    本文摘录自个人总结<Nodejs学习笔记>,更多章节及更新,请访问 github主页地址.欢迎加群交流,群号 197339705. 章节概览 morgan是express默认的日志中间件, ...

  10. Android系统启动分析(Init->Zygote->SystemServer->Home activity)

    整个Android系统的启动分为Linux Kernel的启动和Android系统的启动.Linux Kernel启动起来后,然后运行第一个用户程序,在Android中就是init程序. ------ ...