extjs 的 css
ext 内置提供了许多默认的 css 样式,也可以定制 css,
------
定制 css 样式
各种 Component 提供了 css相关 cp & property & method , 以设置 css 样式,
------
Component 的 css
* config option
* cls 使用的 css class
* disabledClass 当 Component 被 disabled 时,所使用的 css class
* ctcls 作用于 所在Container 的 css class
* itemCls 作用于 表单域 的 css class,
* labelStyle 作用于 label 的 css,内容是 css 代码,
* overCls 鼠标经过时的 css class,
* style 指定 css 样式,值应当满足 Ext.Element.applyStyles() 方法,
* method
* addClass() 添加1个 css class
* removeClass() 删除1个 css class
*
------
icon 的 css
一些 Component 可以带有 icon 图标,
拥有 一些 cp & method 来指定 icon 图标,
可带有 icon 的 组件:
* Button
* BaseItem
* ...
*
icon 相关 的 css
* cp
* iconCls 图标的 css class,通常指定 1个背景图片 作为图标,
* icon 指定1个图标的路径,通常在 iconCls 中指定 即可,
* iconAlign 指定图标的对齐方式,通常在 iconCls 中指定 即可,
* setIconClass() 设置 背图标的 css class
*
* method
* setIconClass 设置 背图标的 css class
*
例子:
/* 定义 css class */
.google_icon {
background-image:url(public/img/google_logo.png) !important;
}
/* 设置 图标 */
{
xtype: 'button',
type: 'button',
text: 'download',
iconCls: 'google_icon'
}
------