3、/css">.icon{background:url(3.gif)04pxno-repeat!important}3、效果图=====================================================================================================================4、JS源代码Ext.onReady(function(){//--开始-->Ext.QuickTips
4、.init();varview=newExt.Viewport({layout:"border",defaults:{frame:true,bodyStyle:"padding:3",margins:"0101"},items:[{region:"north",xtype:"panel",html:"顶部部分"},{region:"south",xtype:"panel",html:"底部部分"},{region:"west",xtype:"form",//header:true,第2页/共2页ExtJs学习资料—Ext.ViewP
5、ort实例[2021年9月18日星期六]//panel头部显示的标题文字(默认值为'')//当指定了titile值时，header元素将会自动被创建并显示panel头部显示的标题文字(默认值为'')//当指定了titile值时，header元素将会自动被创建并显示，除非header属性被指定为false.title:"控制面板",iconCls:"icon",html:"左边部分",collapsible:true,//如果为true,允许用户折叠此区域(默认值为false)//collapseMode:默认情况下,collapse
6、Mode是undefined,唯一支持的两个值是undefined和'mini'.//注意:如果一个可折叠的区域没有标题工具栏,那么collapseMode必须被设置成'mini'以便让用户可以折叠此区域//因为在没有标题工具栏的情况下，工具按钮是不会被渲染的collapseMode:"mini",width:180,//区域的宽度minWidth:180,//此区域允许的最小像素值(默认值为50)//当split为true时,一般情况下需要指定minSize和maxSize参数,以便BoxComponent可以重绘此区域split
7、:true,minSize:180,//拖动最小宽度maxSize:220,//拖动最大宽度useSplitTips:true,//如果为true,当鼠标移过区域的分隔栏时显示一个小提示(默认值为false)splitTip:"按住鼠标左键不放拖动,双击隐藏",//当用户鼠标移过一个不可折叠区域的分隔栏上时显示的小提示collapsibleSplitTip:"按住鼠标左键不放拖动,双击隐藏"},{region:"east",xtype:"panel",html:"右边部分",width:240,minWidth:100,minSiz
8、e:180,//拖动最小宽度maxSize:240,//拖动最大宽度split:true,header:true,collapsible:true},{region:"center",xtype:"panel",html:"中间部分"
