Column列布局

 
  
    rel="stylesheet" type="text/css" href="../resources/css/ext-all.css">
  <script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
  <script type="text/javascript" src="../ext-all.js"></script>
 
    <script>

    Ext.onReady(drawTable);

	function drawTable(){
             var p = new Ext.Panel({
             title: 'column布局',
             width:500,
             height:100,
             layout:'column',//声明布局类型为column
             renderTo:'show',//填充到id为show的区域
             items: [{
                title: '列1',//标题
                html:'
列1内容
',
                //width:100,//采用固定像素宽度
                columnWidth: .25 //采用比例宽度，相当于百分比，总和为1，这里相当于25%，columnWidth总和必须为1
             },{
                title: '列2',
                html:'
列2内容
',
                //width:100,
                columnWidth: .25
             },{
                title: '列3',
                html:'
列3内容
',
                //width:300,
                columnWidth: .5
             }]
        });
    }
    </script>