在jQuery EasyUI中，如果直接在form上布局時當窗口大小調整布局不會改變，將布局應用于body時中間隔著一個form，橫豎不好弄。
網上有多個解決方案，一般都是寫代碼，在窗口大小改變時設置布局。
經實驗，新版本的JQuery EasyUI中布局可以采用以下方式來達到自動適應大小：
首先設置樣式，使html和body高度為100%（因form和div高度設置為100%需要繼承上級）：
<style type="text/css"> html,body { height:100%; margin:0 auto; } </style>然后頁面代碼如下：
<body class="easyui-layout"> <form id="form1" runat="server" style="height:100%; border:green 0px solid;" region="center"> <div style="padding-left:30px; height:40px;" region="north">北</div> <div region="center">中間</div> <div region="west" style="width:30px;">West</div> <div region="east" style="width:40px;">East</div> </form></body>
效果1，小窗口：
效果2，調整大小后：
可以看到布局會自動適應大小了
備注：測試JQuery EasyUI版本從1.3.1可以，1.2.6不可以，中間的沒有試過
以上這篇JQuery EasyUI Layout 在from布局自適應窗口大小的實現方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持武林網。
新聞熱點
疑難解答
