对ExtJS的布局扩展

最新推荐文章于 2021-04-19 00:09:01 发布

enjsky

最新推荐文章于 2021-04-19 00:09:01 发布

阅读量1.2k

点赞数

分类专栏： ExtJ的二次开发扩展文章标签： extjs stylesheet border ext layout 扩展

本文链接：https://blog.csdn.net/enjsky/article/details/4732141

版权

ExtJ的二次开发扩展专栏收录该内容

0 篇文章 0 订阅

订阅专栏

由于ext的布局方式很多，真正常用的不多，所以作者挑选了ext的border
布局进行封装。如果您还有其他布局要求可以通过new Ext的控件方式渲染到页
面，或者联系请联系我们,我们将根据您的需求进行定制。
简单布局
border布局运用east（右）、west（左）、north（上）、south（下）、center
（其余部分）最多5个方位来满足布局需要，其中north和south的优先级最高，
然后是east和west，最低的是center：

通过上图可以理解这里优先级的意思：north 和south占用整个页面的宽，高度
由我们定义；west和east占用north和south高度以外剩下的全部高度，最后
剩余的部分为center，下面是定义5 个div标签来完成布局的实例：

<HEAD>
<TITLE> layout 布局</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="../css/ext-all.css" />
<script type="text/javascript" src="../js/efs-all.js"></script>
</HEAD>
<BODY>
<div region="north" height="100" title="north部分">North部分</div>
<div region="south" height="100" title="South部分">South部分</div>
<div region="west" width="150" title="West部分">West部分</div>
<div region="east" width="150" title="East部分">East部分</div>
<div region="center">中间部分</div>
</BODY>
</HTML>