ExtJs_layout_Table

table布局有类Ext.layout定义,名称为table,该布局负责把容器中的子元素安卓类似普通的html标签
代码示例:
< script   type = "text/javascript" >
Ext.onReady( function (){
     new  Ext.Panel({
        title: "According容器" ,
        renderTo: "btn" ,
        width:400,
        height:200,
        layout: "table" ,
        hideLabels: false ,
        layoutConfig:{
            columns:3
        },
        items:[
               {title: "子元素1" ,html: "这是子元素1的内容" ,rowspan:2,height:100},
               {title: "子元素2" ,html: "这是子元素2的内容" ,colspan:2},
               {title: "子元素3" ,html: "这是子元素3的内容" },
               {title: "子元素4" ,html: "这是子元素4的内容" },
               ]
    });
}); </ script >
指定了table布局;layoutConfig使用columns指定父容器分成3列,子元素中使用rowspans和colspan来指定子元素横跨的单元格数效果:
26113756-028e10c7ec3d4cc9b7eb1cca41812456.png
如果不添加任何的rolspan和colspan那么:
26113756-7512aa2e0d504521b44dafaa1c6a6599.png
如果是: {title:"子元素1",html:"这是子元素1的内容",colspan:2},
那么有:
26113756-0f212f333bd74ab592102367b5f0a9b6.png
如果是:{title:"子元素1",html:"这是子元素1的内容",rowspan:2},
26113756-3d3e965e72e84162877a7f5a677d6785.png
如果是: {title:"子元素2",html:"这是子元素2的内容",rowspan:2},
26113757-a5b8a29722444182b21382890439361c.png




转载于:https://www.cnblogs.com/babyhhcsy/p/3156313.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值