easyui 自定义布局

最新推荐文章于 2022-05-04 16:47:10 发布

lhrcylhr

最新推荐文章于 2022-05-04 16:47:10 发布

阅读量540

点赞数

分类专栏： web前端

本文链接：https://blog.csdn.net/lhrcylhr/article/details/78487240

版权

web前端专栏收录该内容

14 篇文章 0 订阅

订阅专栏

这篇博客展示了如何使用EasyUI创建一个复杂的面板布局。内容包括一个可折叠的面板，内部包含一个自适应的布局。布局中设有北区的搜索框，中心区域进一步划分，包含一个东区展示图片和一个南区的文本区域，其中南区包含一个不可调整大小的文本框，用于显示文本。

摘要由CSDN通过智能技术生成

<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>