一、jQuery Easy UI (适应屏幕分辨率大小)布局(Layout)
1、首先应用的是jquery-easyui-1.4 版本（版本不同，兼容性不同）
2、实现整个页面的布局（ layout: north,south,west,east, center）
3、首先整个页面布局适应屏幕的分辨率大小
4、然后内容区域进行布局，也要适应屏幕分辨率大小
5、部分代码：
<body>
<div class="easyui-layout" fit="true">
<div data-options="region:'north'" style="height: 50px">
<h3>
标题位置</h3>
</div>
<div data-options="region:'south',split:true" style="height: 50px;">
<h3>
底部位置</h3>
</div>
<div data-options="region:'east',split:true" title="East" style="width: 200px;">
<h3>
填充内容</h3>
</div>
<div data-options="region:'west',split:true" title="West" style="width: 200px;">
<h3>
导航菜单位置</h3>
</div>
<div data-options="region:'center'">
<%--注意：必须设置 属性 fit="true"--%>
<div id="tabs" class="easyui-tabs" fit="true">
<div id="home" title="欢迎使用" style="padding: 3px; overflow: hidden;">
<%-- 中间内容布局适应屏幕分辨率大小 注意设置属性 fit="true"--%>
<div class="easyui-layout" fit="true">
<%--如果左右布局必须设置一个的宽度 width--%>
<div id="p" data-options="region:'west',title:'左侧位置',collapsible:false" style="width: 25%;
padding: 0px;">
<%-- 如果里面的内容也要适应屏幕分辨率大小 需设置 width="100%" height="100%"--%>
<div id="departList">
<h4>
填充内容</h4>
</div>
</div>
<div data-options="region:'center',title:'右侧位置'">
<div id="departAddr">
<h4>
填充内容</h4>
</div>
</div>
</div>
</div>
<div title="Test" style="padding: 10px">
This is the Test work.
</div>
<div title="Help" data-options="iconCls:'icon-help',closable:true" style="padding: 10px">
This is the help content.
</div>
</div>
</div>
</div>
</body>
6、运行效果如下：
