ExtJs学习笔记（14）_Column布局

ExtJs学习笔记（14）_Column布局2010-11-16 cnblogs yjmyzzColumn布局有点象传统html中的table的td，但是也有不同的地方:

先看下代码

<script type="text/javascript">
  Ext.onReady（function（）{
    var win=new Ext.Window（{
      title:"Column Layout",
      height:300,
      width:400,
      plain:true,
      layout:"column",
      items:[{
        title:"width=50%",
        columnWidth:0.5,
        html:"width=（容器宽度-容器内其它组件固定宽度）*50%",
        height:200
      },
      {
        title:"width=250px",
        width:200,
        height:100,
        html:"固定宽度为250px"
      }
      ]
    }）;
    win.show（）;
  }）;
</script>

效果图:

对于一下:

<tr>

  <td width="50%"></td>

  <td width="30px"><td>

  <td></td>

</tr>

在table中,这里第一列会占到整个行的50%的宽度，而在ExtJs的column布局中，百分比是指（容器宽度-有固定width值组件的宽度）后，再乘相应百分比得到的宽度