Layout（布局）

布局容器有5个区域：北、南、东、西和中间。中间区域面板是必须的，边缘的面板都是可选的。

每个边缘区域面板都可以通过拖拽其边框改变大小，也可以点击折叠按钮将面板折叠起来。布局可以进行嵌套，用户可以通过组合布局构建复杂的布局结构。

在api文档中，有两种方法渲染

  1. <body class="easyui-layout">
  2. <div data-options="region:'north',title:'North Title',split:true" style="height:100px;"></div>
  3. <div data-options="region:'south',title:'South Title',split:true" style="height:100px;"></div>
  4. <div data-options="region:'east',iconCls:'icon-reload',title:'East',split:true" style="width:100px;"></div>
  5. <div data-options="region:'west',title:'West',split:true" style="width:100px;"></div>
  6. <div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;"></div>
  7. </body>

效果图

第二种就是

  1. <div id="cc" class="easyui-layout" style="width:600px;height:400px;">
  2. <div data-options="region:'north',title:'North Title',split:true" style="height:100px;"></div>
  3. <div data-options="region:'south',title:'South Title',split:true" style="height:100px;"></div>
  4. <div data-options="region:'east',iconCls:'icon-reload',title:'East',split:true" style="width:100px;"></div>
  5. <div data-options="region:'west',title:'West',split:true" style="width:100px;"></div>
  6. <div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;"></div>
  7. </div>

这种设置  好多bug...  解决不了啊， 那个大哥帮我解决一下下...

easyUI 布局的更多相关文章

  1. Easyui布局

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

  2. EasyUI学习总结(六)——EasyUI布局

    一.EasyUI布局介绍 easyUI布局容器包括东.西.南.北.中五个区域,其中中心面板是必须的,而东.西.南.北这四个面板是可选的,如果布局里面不需要东.西.南.北这四个面板,那么可以把相应的di ...

  3. Easyui入门视频教程 第04集---Easyui布局

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

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

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

  5. EasyUI学习总结(六)——EasyUI布局（转载）

    本文转载自:http://www.cnblogs.com/xdp-gacl/p/4088198.html 一.EasyUI布局介绍 easyUI布局容器包括东.西.南.北.中五个区域,其中中心面板是必 ...

  6. easyui 布局自适应

    最近在把以前写的一个项目改成用easyui做前端.过程中遇到了不少问题.其中一个就是datagrid不能很好的布局.想了好多办法都有局限.最后想到会不会是布局(easyui-layout)的问题,经过 ...

  7. jQuery EasyUI布局容器layout实例精讲

    这个布局容器,有五个区域:北.南.东.西和中心. 他中心地区面板是必需的,但是边缘地区面板是可选的.每一个边缘地区面板可以缩放的拖动其边境, 他们也可以通过点击其收缩触发.布局可以嵌套,从而用户可以建 ...

  8. easyui 布局之window和panel一起使用时，拉动window宽高时panel不跟随一起变化

    项目开发中布局是每一个组件都由最外层的window和内部的至少一个panel组成,其他的细小组件再依次放到panel中. 问题:当拉动外部的window时我们希望内部的panel的宽高也跟着变化,但是 ...

  9. EasyUI 布局 - 动态添加标签页（Tabs）

    首先导入js <link rel="stylesheet" href="../js/easyui/themes/default/easyui.css"&g ...

随机推荐

  1. Vue input 控件: 通过自定义指令(directive)使用正则表达式限制input控件的输入

    前言: 网站中的input输入框使用非常广泛,因业务场景不同需要对输入框做合法性校验或限制输入,比如电话号码.邮件.区号.身份证号等.input框的不合法内容主要有两种方式处理:1.用户输入内容后,通 ...

  2. Oracle GoldenGate OGG管理员手册

    第一章 系统实现简述 前言 编写本手册的目的是为系统管理员以及相关操作人员提供 Oracle  Goldengat  软 件的日常维护和使用的技术参考: 3 ORACLE 第二章 OGG 日常维护操作 ...

  3. 知识点整理-mysql的顺序I/O和随机I/O

    假设有这样一张表: CREATE TABLE `person_info` ( `id` ) NOT NULL AUTO_INCREMENT, `name` varchar() NOT NULL, `b ...

  4. MongoDB可视化工具Studio 3T的使用

    原文地址:https://blog.csdn.net/weixin_39999535/article/details/81383196 studio3T 永久使用方法 新建文件studio3t.bat ...

  5. 如何将Nginx注册为系统服务，开机自启动

    亲测有效! 一般程序员在实际工作中,除了敲代码,很少有机会实际接触操作其它东西,例如服务器环境搭建,项目部署等等,不是领导信任或项目组核心成员,应该是没有机会实际接触的,只能通过网上资料稍微了解一下. ...

  6. 使用power designer，PL/SQL，cmd建立oracle数据库

    这一系列操作需要powerDesigner,PL/SQL工具 1.首先使用powerDesigner建立概念模型 2.概念模型界面例子 3.其中建立概念模型操作图标详解 4.建立物理模型 5.生成数据 ...

  7. GCD欧几里得的拓展算法

    欧几里得算法的拓展主要是用于求解   : 已知整数 a, b,然后我们进行  ax + by == gcd(a , b) 的问题求解 那么如何进行求解呢?和欧几里得算法一样, 我们需要进行递归的方式进 ...

  8. 最长回文 HDU - 3068（马拉车算法）

    Problem Description 给出一个只由小写英文字符a,b,c...y,z组成的字符串S,求S中最长回文串的长度. 回文就是正反读都是一样的字符串,如aba, abba等 Input 输入 ...

  9. java web开发环境设置

    Mapped Statements collection does not contain value for后面是什么类什么方法之类的问题: 除了"https://changbl.itey ...

  10. 笔记-4：python组合数据类型

    1.字符串(str) 字符串是字符的序列表示, 根据字符串的内容多少分为单行字符串和多行字符串. 单行字符串可以由一对单引号(') 或双引号(")作为边界来表示, 单引号和双引号作用相同. ...