玖玖爱综合,国产第二页,日韩亚洲欧美国产中文

欧美日韩亚-欧美日韩亚州在线-欧美日韩亚洲-欧美日韩亚洲第一区-欧美日韩亚洲二区在线-欧美日韩亚洲高清精品

jQuery EasyUI使用教程：在面板中創(chuàng)建復(fù)雜布局

原創(chuàng)|使用教程|編輯：龔雪|2015-11-02 09:13:18.000|閱讀 716 次

概述：本教程主要為大家介紹如何在面板中創(chuàng)建復(fù)雜的布局。

# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>

<jQuery EasyUI最新版下載>

本教程主要為大家介紹如何在面板中創(chuàng)建復(fù)雜的布局。面板允許你創(chuàng)建用于多種用途的自定義布局，在本示例中，我們通過使用面板和布局插件來創(chuàng)建一個MSN的消息框。

我們在區(qū)域面板中使用多個布局。在消息框頂部我們放置一個搜索輸入，將一個人物圖片放置在右邊。在中間的區(qū)域我們通過將split屬性設(shè)置為true，來把這部分切割為兩部分，允許用戶改變區(qū)域面板的尺寸大小。

下面是所有的代碼：

<div class="easyui-panel" title="Complex Panel Layout" iconCls="icon-search" collapsible="true" style="padding:5px;width:500px;height:250px;">
<div class="easyui-layout" fit="true">
<div region="north" border="false" class="p-search">
<label>Search:</label><input></input>
</div>
<div region="center" border="false">
<div class="easyui-layout" fit="true">
<div region="east" border="false" class="p-right">
<img src="images/msn.gif"/>
</div>
<div region="center" border="false" style="border:1px solid #ccc;">
<div class="easyui-layout" fit="true">
<div region="south" split="true" border="false" style="height:60px;">
<textarea style="border:0;width:100%;height:100%;resize:none">Hi,I am easyui.</textarea>
</div>
<div region="center" border="false">
</div>
</div>
</div>
</div>
</div>
</div>
</div>

我們不需要編寫任何JavaScript代碼，它自身擁有強(qiáng)大的用戶界面設(shè)計功能。

下載該EasyUI示例：

購買最新正版授權(quán)！""