这个布局容器,有五个区域:北、南、东、西和中心。 他中心地区面板是必需的,但是边缘地区面板是可选的。每一个边缘地区面板可以缩放的拖动其边境, 他们也可以通过点击其收缩触发.布局可以嵌套,从而用户可以建立他想要的复杂的布局。layout可以基于body或者 div 进行布局。 
效果：

 <!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title>easyui-layout的使用</title>

         <!-- 导入jquery核心类库 -->

         <script type="text/javascript" src="../js/jquery-1.8.3.js"></script>

         <!-- 导入easyui类库 -->

         <link id="easyuiTheme" rel="stylesheet" type="text/css" href="../js/easyui/themes/default/easyui.css">

         <link rel="stylesheet" type="text/css" href="../js/easyui/themes/icon.css">

         <link rel="stylesheet" type="text/css" href="../css/default.css">

         <script type="text/javascript" src="../js/easyui/jquery.easyui.min.js"></script>

     </head>

     <body class="easyui-layout">

         <div data-options="region:'north',title:'你我他学习吧-学习Java的好博客！'" style="height:100px"></div>

         <div data-options="region:'west',title:'西部区域'" style="width:100px"></div>

         <div data-options="region:'center',title:'中部区域'"></div>

         <div data-options="region:'east',title:'东部区域'" style="width:100px"></div>

         <div data-options="region:'south',title:'南部区域'" style="height:100px"></div>

     </body>

 </html>

jQuery EasyUI布局容器layout实例精讲的更多相关文章

  1. jQuery EasyUI 选项卡面板tabs使用实例精讲

    1. 对选项卡面板区域 div 设置 class=”easyui-tabs” 2. 对选项卡面板区域添加多个 div,每个 div 就是一个选项卡(每个面板一定设置 title) 3. 设置面板 fi ...

  2. jQuery EasyUI window窗口使用实例

    需求:点击[增加]按钮,弹出窗口,并对所有输入项内容进行校验,校验通过就提交给后台的action处理,没有通过校验就弹窗提示.  <!DOCTYPE html> <html> ...

  3. plsql实例精讲部分笔记

    转换sql: create or replace view v_sale(year,month1,month2,month3,month4,month5,month6,month7,month8,mo ...

  4. 布局容器layout Container

    画布canvas 盒子Box VBox Hbox-->HGroup VGroup 控制条 ControlBar

  5. (转)jquery easyui treegrid使用小结 （主要讲的是如何编辑easyui中的行信息包括添加 下拉列表等）

    在实际应用中可能会碰到不同的需求,比如会根据每行不同的参数或属性设置来设置同列不同的editor类型,这时原有的例子就显的有点太过简单,不能实现我们的需求,现在应用我在项目中的操作为例,显示下实现同列 ...

  6. MySQL创建用户与授权方法实例精讲

    MySQL中创建用户与授权的实现方法. 运行环境:widnows xp professional + MySQL5.0 一, 创建用户: 命令:CREATE USER 'username'@'host ...

  7. Android——Fragment实例精讲——底部导航栏+ViewPager滑动切换页面

    说明: 实现效果: 1- 用ViewPager实现Fragmen之间的切换 2- 底部用RadioGroup实现,更方便的实现图片和字体颜色的改变,更方便的通过RadioButton的点击事件来控制页 ...

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

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

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

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

随机推荐

  1. C. Lorenzo Von Matterhorn LCA

    C. Lorenzo Von Matterhorn time limit per test 1 second memory limit per test 256 megabytes input sta ...

  2. 弱省胡策 Magic

    弱省胡策 Magic 求\(n\)个点\(n\)的条边的简单联通图的个数. 毒瘤,还要写高精. 我们枚举环的大小\(k\),\(\displaystyle ans=\sum_{k=3}^nC_n^k ...

  3. Git 安装及用法 github 代码发布 gitlab私有仓库的搭建

    版本控制是一种记录一个或若干文件内容变化,以便将来查阅特定版本修订情况的系统. 这个版本控制软件,有 svn还有git,是一个工具. git是由linux的作者开发的 git是一个分布式版本控制系统 ...

  4. C#多线程の遇见长耗时操作以及多任务（简明记要）

    4.0用         Task.Factory.StartNew(()=>{});4.0以下用  ThreadPool.QueueUserWorkItem(()=>{})4.0以上用 ...

  5. 在 PHP 7 中不要做的 10 件事

    在 PHP 7 中不要做的 10 件事 1. 不要使用 mysql_ 函数 这一天终于来了,从此你不仅仅“不应该”使用mysql_函数.PHP 7 已经把它们从核心中全部移除了,也就是说你需要迁移到好 ...

  6. tomcat 设置虚拟路径的4种方法

    通常使用方法1或者方法2  方法1 (添加配置文件):推荐使用,不需要重启服务器 在Tomcat根目录下的/conf/Catalina/localhost/ 路径下新建一个filename.xml,并 ...

  7. 用golang chromedp 操作已经打开的chrome浏览器

    win7 环境,主要是一开始想在代码中先用exec.Command启动chrome,但始终不能成功监听9222端口,折腾了很长时间, 需要先手工启动chrome监听端口,具体写在代码注释中了. 然后再 ...

  8. 电脑如何用HDMI连接电视

    因为现在的液晶电视基本上都有VGA接口,所以你可以很容易地用VGA线实现电脑连接电视上,但是该文有一个地方没有提到,那就是分辨率的问 题,现在的液晶电视的主流面板已经是全高清面板(1920X1080) ...

  9. 微信硬件平台（七）微信开发--如何存储并定时更新access_token

    https://blog.csdn.net/sct_t/article/details/53002611 我们知道请求access_Token会返回这样一个json,包括access_token(凭证 ...

  10. KindEditor 开源得富文本编辑器

    正常HTML情况写输入长文本需要textarea 标签 .但textarea 标签局限性很大,切只能输入单一的文本,我们大多情况下看到的新闻类文本信息大多是图文混排得,且有的配有视频和音乐. 我们可以 ...