`
tiandirensoon
  • 浏览: 597373 次
文章分类
社区版块
存档分类
最新评论

EXT iconCls说明

 
阅读更多

今天学习ext 看examples中的事例,其中有一个地方是这样写的:

new ButtonPanel(
'Icon Only',
[{
iconCls: 'add16'
},{
iconCls: 'add24',
scale: 'medium'
},{
iconCls: 'add',

scale: 'large'
}]
);

例子的效果是:


看了半天没有明白iconCls后面的add16 ,add24是什么意思。后来看到buttons.css 终于明白了应该是图片样式的意思,既是CSS里面定义的class。

后来看了看API,里面也是这么写的。遇到什么问题还是多看API。

iconCls : String

用来指定背景图片的样式类。A css class which sets a background image to be used as the icon for this button

/*!
* Ext JS Library 3.2.1
* Copyright(c) 2006-2010 Ext JS, Inc.
* licensing@extjs.com
* http://www.extjs.com/license
*/
.add {
background-image: url(images/add.gif) !important;
}
.add16 {
background-image: url(images/add16.gif) !important;
}
.add24 {
background-image: url(images/add24.gif) !important;
}

.btn-panel td {
padding-left:5px;
}

h2 {
color:#083772 !important;
margin: 20px 0 0 !important;
padding: 5px;
background:#eee;
width:400px;
}

h3 {
font-weight:normal !important;
}

分享到:
评论

相关推荐

    EXT 最新icon图标大集合,节省时间专用

    EXT,EasyUI 最新icon图标大集合,节省时间专!

    Ext JS 1713个icon图标

    由于最近在研究Extjs4.1.1,没想到Extjs没有自带的iconCls所使用的图标样式css,就是用那个写那个的,纠结了半天,网上也找了好久,还是自己写了个批量处理程序,集合了1713个png小图标,都是Extjs原生态的,直接...

    Ext JS 删除的代码

    var system_add_rent = new Ext.Toolbar({ border : false, items : [{ text : "添加月租金", iconCls : "add10", listeners : { click : function() { add_rent.show(); } ...

    适用于easyui,extjs等的 200 个 icon图标大全(2000个icon)

    适用于easyui,extjs等的 200 个 icon图标大全(2000个icon)。 icon图标大全(2000个icon),适用于easyui,extjs等,可适用各种信息系统开发 easyui,icon

    button的js代码

    Ext.onReady(function(){ // This function renders a block of buttons function renderButtons(title){ Ext.getBody().createChild({tag: 'h2', html: title}); new ButtonPanel( 'Text Only', [{ text:...

    IconTextField

    给JTextField添加图标 在输入框中添加图标

    经典PNG图标集合之三

    做网站肯定用的上。有需要的下载,共四集。大约1500张左右

    EXTJS4.1计算器插件

    由于开发WEB需要一个WEB计算器插件,在网上找EXTJS4计算器插件没有一个,找extjs4.0计算器...用的时候只需var caculatepanel = new Ext.create('Ext.ux.Caculate', { region: 'east', iconCls: 'icon-help' })就行了

    ExtJS网页小图标icons

    此压缩包,包含了我们网页中常用的ICON小图标,可以直接引用无需修改,上千个图标资源任君挑选

    easyui,extjs图标icon图标大全

    icon图标大全(2000个icon),适用于easyui,extjs等,可适用各种信息系统开发

    treepanel动态加载数据实现代码

    代码如下: var tree = new Ext.tree.TreePanel({ region:’west’, title:’站点树:’, width:200, minSize:150, maxSize:200, iconCls:’ux-auth-menu-header-icon’, split:true, autoScroll:true, autoHeight:...

    icon图标大全(2000个icon),适用于easyui,extjs等

    icon图标大全(2000个icon),适用于easyui,extjs等,可适用各种信息系统开发

    EasyUI_Icon_图标扩展样式(1775个)

    花积分下载的,免费共享.. 原下载地址:http://download.csdn.net/download/miracle98/7579723

    extjs-desktop

    MyDesktop.Test = Ext.extend(Ext.app.Module, { id:'bb-cc',//DIV中的ID值 init : function(){ this.launcher = { text: 'abcdefg',//菜单中显示的文本 iconCls:'tabs', handler : this.createWindow, ...

    多种多样各类icon图标库

    多种多样各类icon图标库集合大全 方便各程序员开发时使用

    handler与listener的区别

    Handler handler与Action相关联,一个Action可以有多个...Action是一个可被共享的对象,有五个主要的属性:text, handler, iconCls, disabled, hidden component的构建方式比较有意思: new Ext.Button(action)

    铅笔画软件图标下载

    该文档为铅笔画软件图标下载,是一份很不错的参考资料,具有较高参考价值,感兴趣的可以下载看看

    网页制作和easyUI常用图标

    便于前端开发者使用的图标,齐全!也可与easyUI配套使用!

    extjs中form与grid交互数据(record)的方法

    首先在grid的tbar中定义编辑按钮:Js代码 代码如下:id:’editDataButton’, text:’编辑’, tooltip:’编辑’, iconCls:’edit’, handler: function(){ showeditPanel();} 再定义form: Js代码 代码如下:var ...

    RDF 框架使用

    <div iconCls="icon-panel" id="NewPostWin" align="center" xtype="window" width="600" height="150" title="新增岗位信息" resizable="true" modal="true" autoScroll="true"> <form id="addFrmData" class=...

Global site tag (gtag.js) - Google Analytics