<html>

<head>

    <script src="jquery-easyui/jquery.min.js"></script>

    <script src="jquery-easyui/jquery.easyui.min.js"></script>

    <script src="jquery-easyui/easyloader.js"></script>

    <script src="jquery-easyui/locale/easyui-lang-zh_CN.js"></script>

    <link rel="stylesheet" type="text/css" href="jquery-easyui/themes/default/easyui.css">

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

</head>

<body>

    <div id="cc" class="easyui-layout" style="width:600px;height:400px;" >

        <div region="north"  title="North Title"  style="height:100px;"></div>

        <div region="south"  title="South Title" split="true" style="height:100px;"></div>

        <div region="east"  title="East" split="true" style="width:100px;"></div>

        <div region="west" split="true" title="West" style="width:100px;"></div>

        <div region="center" title="center title" ></div>

    </div>  

    <!--

    title：布局面板的标题。

    <div id="cc" class="easyui-layout" style="width:600px;height:400px;">

        <div region="north" title="North Title" split="true" style="height:100px;"></div>

    </div>

    region：定义布局面板的位置（方向），可以取下列值的其中之一：north, south, east, west, center。

    <div id="cc" class="easyui-layout" style="width:600px;height:400px;">

        <div region="north" title="North Title" split="true" style="height:100px;"></div>

        <div region="south" title="South Title" split="true" style="height:100px;"></div>

        <div region="east"  title="East" split="true" style="width:100px;"></div>

        <div region="west" split="true" title="West" style="width:100px;"></div>

        <div region="center" title="center title" href="1.html" style="padding:5px;background:#eee;"></div>

    </div>

    border：设置为true将显示布局面板的边框。

    <div id="cc" class="easyui-layout" style="width:600px;height:400px;">

        <div region="north" border=true title="North Title" split="true" style="height:100px;"></div>

    </div>

    split：如果设置为true将显示一个分隔条，用户可以拖动分隔条来改变布局面板的尺寸。

    <div id="cc" class="easyui-layout" style="width:600px;height:400px;" >

        <div region="north"  title="North Title" split="true" style="height:100px;"></div>

    </div>

    iconCls：一个用来显示布局面板头部图标的css类。

    <div id="cc" class="easyui-layout" style="width:600px;height:400px;" >

        <div region="north" iconCls="icon-reload" title="North Title" split="true" style="height:100px;"></div>

    </div>

    href：一个用来从远程站点载入数据的超链接。

    <div id="cc" class="easyui-layout" style="width:600px;height:400px;" >

        <div region="north" href="1.html" title="North Title" split="true" style="height:100px;"></div>

    </div>

    -->

</body>

</html>

jQuery EasyUI API 中文文档 - 布局（Layout）的更多相关文章

  1. jQuery EasyUI API 中文文档 - ComboGrid 组合表格

    jQuery EasyUI API 中文文档 - ComboGrid 组合表格,需要的朋友可以参考下. 扩展自 $.fn.combo.defaults 和 $.fn.datagrid.defaults ...

  2. jQuery EasyUI API 中文文档 - ValidateBox验证框

    jQuery EasyUI API 中文文档 - ValidateBox验证框,使用jQuery EasyUI的朋友可以参考下.   用 $.fn.validatebox.defaults 重写了 d ...

  3. jQuery EasyUI API 中文文档

    http://www.cnblogs.com/Philoo/tag/jQuery/ 共2页: 1 2 下一页  jQuery EasyUI API 中文文档 - 树表格(TreeGrid) 风流涕淌 ...

  4. jQuery EasyUI API 中文文档 - Panel面板

    <html> <head> <title>布局管理器--控制面板</title> <script src="jquery-easyui/ ...

  5. jquery easyui 弹出消息框 (转载) jQuery EasyUI API 中文文档 - 消息框（Messager） http://www.cnblogs.com/hantianwei/archive/2012/03/19/2407113.html

    <html> <head> <!-- 导入easyui插件的js和css样式; --> <link rel="stylesheet" ty ...

  6. jQuery EasyUI API 中文文档 - 分隔按钮（splitbutton）

    <html> <head> <script src="jquery-easyui/jquery.min.js"></script> ...

  7. jQuery EasyUI API 中文文档 - 菜单按钮（menubutton）

    <html> <head> <script src="jquery-easyui/jquery.min.js"></script> ...

  8. jQuery EasyUI API 中文文档 - 链接按钮（linkbutton）

    <html> <head> <script src="jquery-easyui/jquery.min.js"></script> ...

  9. jQuery EasyUI API 中文文档 - 面板（Panel）

    Panel 面板   用$.fn.panel.defaults重写defaults. 用法示例 创建Panel 1. 经由标记创建Panel 从标记创建Panel更容易.把 'easyui-panel ...

随机推荐

  1. 在 Visual Studio 调试器中指定符号 (.pdb) 和源文件

    查找并指定符号文件和源文件:指定符号加载行为.使用符号和源服务器上:加载符号自动或在要求.   内容 查找符号 (.pdb) 文件 查找源文件   查找符号 (.pdb) 文件 说明 在之前的 Vis ...

  2. Android网络：开发浏览器（二）——功能完善之长按网页图片菜单

    上述的历史和书签的功能已经实现.不过如果我们长时间按住图片,并不会出现如同UC中的一系列选项,我们可以来看看UC中的长按图片出现的菜单. 图10.2.9    UC中的长按图片菜单 我们可以看到UC中 ...

  3. QT中的pro文件的编写

    原地址:http://blog.csdn.net/fjb2080/article/details/4833666 我们在编译QT的工程的时候,一般都会让qmake自动生成,但有时我们需要定制我们的工程 ...

  4. java 变长參数使用原则

    1.java变长參数用...表示,如Print(String... args){  ... }; 2.假设一个调用既匹配一个固定參数方法.又匹配一个变长參数方法,则优先匹配固定參数的方法 3.假设一个 ...

  5. Android手机怎样录制屏幕及转GIF

    有时候我们须要录制Android 手机的屏幕,比方写了一个Demo应用,须要公布到博客和微博上. 例如以下是我录制转GIF的效果图 对于Android4.4的上的手机,系统自带了一个命令screenr ...

  6. Python 链接MysqlDB

    下载安装MySQLdb <1>linux版本 http://sourceforge.net/projects/mysql-python/ 下载,在安装是要先安装setuptools,然后在 ...

  7. 【HTML】让<pre>标签文本自动换行

    利用<pre></pre>这个标签可以将其包起来的文字排版.格式,原封不动的呈现出来. 也就是说你输入的东西被原封不动的输出,包括你输入的空格之类的,不用 和<BR> ...

  8. Flex Label自动截取、自动换行

    label.maxDisplayedLines=0;      // 默认多行显示,不截取 label.maxDisplayedLines=1;     //任意整数,显示单行文本,自动截取(...) ...

  9. 【玩转cocos2d-x之四十】怎样在Cocos2d-x 3.0中使用opengl shader？

    有小伙伴提出了这个问题.事实上GLProgramCocos2d-x引擎自带了.全然能够直接拿来用. 先上图吧. 使用opengl前后的对照: watermark/2/text/aHR0cDovL2Js ...

  10. 马航MH17事件将把普京逼入绝境?

    据7月22日报道,马克兰东部民间武装22日凌晨将失事客机的"黑匣子"交给马来西亚方面.乌政府与民间武装允许在坠机地点附的小范围停火. 与此同一时候,联合国安理会21日通过决议,敦促 ...