目录

目录

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

我们继续讲布局

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. pthread_create 报函数参数不匹配问题

    pthread_create方法遇到类方法时总会报  argument of type ‘void* (Thread::)(void*)’ does not match ‘void* (*)(void ...

  2. python对json的操作总结 zz

    Json简介:Json,全名 JavaScript Object Notation,是一种轻量级的数据交换格式.Json最广泛的应用是作为AJAX中web服务器和客户端的通讯的数据格式.现在也常用于h ...

  3. C++模拟键盘消息

    实现功能:在现有DLL程序中向特定的EXE窗口中发送模拟键盘的消息 使用API根据窗口标题递归查找特定的窗口句柄,之后模拟调用. 注意:keybd_event函数不能在VS下使用,所以用SendInp ...

  4. 论文分享|《Universal Language Model Fine-tuning for Text Classificatio》

    https://www.sohu.com/a/233269391_395209 本周我们要分享的论文是<Universal Language Model Fine-tuning for Text ...

  5. JAVA-错误The type BookServiceImpl must implement the inherited abstract method

    错误原因 :是因为class继承了其他的类,没有导入过来,选择add unimplemented methods进行解决

  6. Java中动态代理方式：

    JDK中生成代理对象的API 代理类所在包:java.lang.reflect.ProxyJDK实现代理只需要使用newProxyInstance方法,但是该方法需要接收三个参数,完整的写法是: st ...

  7. MFC如何获取硬盘的序列号

    要把如下的两篇文章结合起来看: qt怎么获取硬盘序列号,是不是没戏? http://www.qtcn.org/bbs/simple/?t65637.html system("wmic pat ...

  8. Solr搭建真实项目

    在经过solr5.4.1 quick start  的学习后.我们要搭建真实的项目了 1.启动项目 bin/solr start 2.创建core bin/solr create -c pms 3.为 ...

  9. Android版-微信APP支付

    首发地址: Android版-微信APP支付 欢迎留言.转发 微信极速开发系列文章(微信支付.授权获取用户信息等):点击这里 目录 1.注册账号.开发者认证 2.添加应用 3.申请微信支付 4.技术开 ...

  10. CSS3实现的苹果网站搜索框效果

    在线演示 本地下载 用CSS3相关属性生成的动态搜索框效果.