EXTJS4 设置label 样式

长江

于 2011-11-22 22:58:50 发布

阅读量3w

点赞数

分类专栏： VS2010.net MVC+EXTJS4 文章标签： extjs border flex function layout

本文链接：https://blog.youkuaiyun.com/lonestar555/article/details/7002400

版权

VS2010.net MVC+EXTJS4 专栏收录该内容

29 篇文章

订阅专栏

本文介绍EXTJS4中如何设置并自定义label的样式，包括使用border、flex属性以及应用function进行布局调整，助你实现灵活的界面布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 <style type="text/css"  >
        #label2{font-size: 12px; color: #868600;background-color:#808000} 
        .classDiv1{font-size: 12px; color: #808000; } 
        .classDiv2{font-size: 12px; color: #EEE000; } 
    </style>

 panel11 =   Ext.create('Ext.form.Panel', {
                title: 'Field with Label',
                border: true,
                width: 400, bodyPadding: 10,
                renderTo: Ext.getBody(),
                layout: { type: 'hbox', align: 'middle' },
                items: [
                { xtype: 'textfield', hideLabel: true, flex: 1 },
          { xtype: 'label',
               cls: 'classDiv1',  
              itemId: 'label1',  
              text: 'My Awesome Field', margins: '0 0 0 10'
          }, { xtype: 'label',
              cls: 'classDiv2',
              itemId: 'label2', 
              text: 'My Awesome Field', margins: '0 0 0 10'
          }]
            });

function SetLabelColor() {
      var bb = panel11.getComponent('label1')
      //alert(bb);
      bb.removeCls('classDiv1');
      bb.addCls('classDiv2');
  }