目录

目录

-----------------------

我们继续讲布局

full 全屏 布局
<body class="easyui-layout">

        <div data-options="region:'north',border:false" style="height:60px;background:#B3DFDA;padding:10px">north region</div>

        <div data-options="region:'west',split:true,title:'West'" style="width:150px;padding:10px;">west content</div>

        <div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>

        <div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;">south region</div>

        <div data-options="region:'center',title:'Center'"></div>

</body>

整个body 作为一个布局容器

嵌套布局

        <div class="easyui-layout" style="width:700px;height:350px;">

                <div data-options="region:'north'" style="height:50px"></div>

                <div data-options="region:'south',split:true" style="height:50px;"></div>

                <div data-options="region:'east',split:true" title="East" style="width:180px;"></div>

                <div data-options="region:'west',split:true" title="West" style="width:100px;"></div>

                <div data-options="region:'center',iconCls:'icon-ok'" title="Center">

                        <div class="easyui-layout" data-options="fit:true">

                                <div data-options="region:'north',split:true,border:false" style="height:50px"></div>

                                <div data-options="region:'west',split:true,border:false" style="width:100px"></div>

                                <div data-options="region:'center',border:false"></div>

                        </div>

                </div>

        </div>

这个东西 就是 收缩
collapsed:true

视频下载地址

http://pan.baidu.com/s/1sjEpVTr

源码

http://www.bamn.cn/thread-3982-1-1.html

Easyui入门视频教程 第04集---Easyui布局的更多相关文章

  1. Easyui入门视频教程 第05集---Easyui复杂布局

    目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的使用  ...

  2. Easyui入门视频教程 第03集---Easyui布局

    Easyui入门视频教程 第03集---Easyui布局 目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教 ...

  3. Easyui入门视频教程 第11集---Window的使用

    目录 Easyui入门视频教程 第11集---Window的使用   Easyui入门视频教程 第10集---Messager的使用  Easyui入门视频教程 第09集---登录完善 图标自定义   ...

  4. Easyui入门视频教程 第09集---登录完善 图标自定义

    目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的使用  ...

  5. Easyui入门视频教程 第08集---登录实现 ajax button的使用

    目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的使用  ...

  6. Easyui入门视频教程 第06集---Layout初始化和属性方法使用

    目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的使用  ...

  7. Easyui入门视频教程 第02集--- ASP.NET MVC下 搭建 EasyUI环境

    Easyui入门视频教程 第02集--- ASP.NET MVC下 搭建 EasyUI环境 目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标 ...

  8. Easyui入门视频教程 第01集---认识Easyui

    认识EasyUI 目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax b ...

  9. Easyui入门视频教程 第10集---Messager的使用

    Easyui入门视频教程 第10集---Messager的使用 <script type="text/javascript"> function show(){ $.m ...

随机推荐

  1. Groupnet, Subnet, IP Pool的概念

    Groupnet是OneFS 8.0新引入的network object,专门为了服务Multi-Tenancy而创建,目的是让OneFS可以同时地处理多套网络配置. 如果用户不需要使用multi-t ...

  2. CSS-图像映射

    图像映射是将一些区域变成热点,我们在网上获取搜索图片,图片上会有关于任务的简短信息介绍,还有一个接触更多的就是QQ空间的相册,浏览QQ空间照片鼠标滑动到人物头像的时候让你选择标记人物,都是将图片和内容 ...

  3. Android 第三方加固方案 对比 MD

    常见的第三方加固方案官网介绍 由于安卓APP是基于Java的,所以极容易被破解,一个不经过加固的APP犹如裸奔一样,毫无防备.之前曾有新闻报道,一些专职的APP打包黑产就是专门从各种渠道找到apk,通 ...

  4. Centos安装FTP服务器和配置

    安装 yum install vsftpd 启动/重启/关闭 /sbin/service vsftpd start /sbin/service vsftpd restart /sbin/service ...

  5. WPF装饰元素

    Border: <Style TargetType="Border"> <Setter Property="CornerRadius" Val ...

  6. RedisTemplate 分页

    利用spring redis的RedisTemplate进行分页: 场景: 现有项目若干,根据项目的创建时间(createTime)进行降序读取: 存储结构: key:proList(list) 存放 ...

  7. spring结合mockito

    转载:https://blog.csdn.net/apexlj/article/details/50298029 mockito可模拟依赖对象的行为,从而简化跨类的测试. maven获取mockito ...

  8. Slitaz 中文定制手册

    源: http://www.simplemind.info/technolife/opensource/slitaz-cn.html 有关 Slitaz 的一些网站 slitaz的网站:http:// ...

  9. 分享几套生成iMac相关高逼格免费mockup的素材和在线工具

    好久没有过来转, 今天姐姐我分享几套高逼格的iMac相关设计资源, 希望各位靓妹帅哥会喜欢, 最重要滴是,都是FREE,此处应有掌声~~~ , yeah!! iMac桌面效果Mockup 只需要下载后 ...

  10. Android ListView 和 ***Adapter 从本地/网络获取歌曲列表

    本文内容 环境 项目结构 测试数据 演示 1:SimpleAdapter 演示 2:BaseAdapter 演示 3:CustomLazyList 演示 4:CustomLazyCompleteLis ...