<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<!-- 1jQuery的js包 -->

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

<!-- 2css资源 -->

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

<!-- 3图标资源 -->

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

<!-- 4easyui的js包 -->

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

  <!-- 5本地语言包 -->

<script type="text/javascript" src="jquery-easyui-1.4.4/locale/easyui-lang-zh_CN.js"></script>

<script type="text/javascript">

$(function(){

    //创建打开新标签的按钮

    $(".easyui-linkbutton").click(function(){

    var tab_title=$(this).text();

    var tab_href=$(this).attr("title");

    if($("#tt").tabs("exists",tab_title))

        {

        $("#tt").tabs("select",tab_title)

        }

    else

        {

        $("#tt").tabs('add',{

            title:tab_title,

            closable:true,

            href:tab_href

                })

        }

    });

})

</script>

</head>

<body class="easyui-layout">

 <div data-options="region:'north',title:'North Title',split:true" style="height:100px;"></div>

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

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

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

    <div id="ac" class="easyui-accordion" data-options="fit:true,selected:1">

    <div title="员工信息"><a id="add_tab"  style="width:100%;align:center" href="#"></a><br>

    <a class="easyui-linkbutton" title="addUserhtml.html" style="align:center; width:100% " href="#">添加新员工</a><br>

    <a class="easyui-linkbutton" title="edit.html" style="align:center; width:100% " href="#">修改员工</a><br>

    <a class="easyui-linkbutton"  title="delete.html" style="align:center; width:100% "  href="#">删除员工</a><br>

    <a class="easyui-linkbutton"  title="productlist.html" style="align:center; width:100% "  href="#">产品列表</a><br>

    <a class="easyui-linkbutton"  title="studentlist.html" style="align:center; width:100% "  href="#">学生列表</a><br>

    </div>

    <div title="考勤信息">这是考勤信息模块</div>

    <div title="招聘信息">这是招聘信息模块</div>

    <div title="薪酬信息">这是薪酬信息模块</div>

    <div title="员工信息">这是员工信息模块</div>

    </div>

    </div>

    <div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;" >

    <div id="tt" class="easyui-tabs" data-options="fit:true" style="width:500px;align:center;height:250px;" >

    <div title="Tab1" style="padding:20px;width:100%;align:center;">

        tab1

    </div>

    <div title="Tab2" data-options="closable:true" style="overflow:auto;padding:20px;width:100%;align:center;">

        tab2

    </div>

    <div title="Tab3" data-options="iconCls:'icon-reload',closable:true" style="padding:20px;width:100%;align:center;">

        tab3

    </div>

    </div>

    </div>

</body>

</html>

layout布局的更多相关文章

  1. 新建android工程的时候eclipse没有生成MainActivity和layout布局

    一.新建android工程的时候eclipse没有生成MainActivity和layout布局 最近由于工作上的原因,开始学习Android开发,在入门的时候就遇到了不少的坑,遇到的第一个坑就是&q ...

  2. layout布局实例化

    实例化xml中的Layout布局在开发中经常会用到,有几种方法可以使用 1.在Activity中使用getLayoutInflater()方法 View layout = getLayoutInfla ...

  3. ASP.NET MVC3 系列教程 – 新的Layout布局系统

    原文地址:http://www.cnblogs.com/highend/archive/2011/04/18/asp_net_mvc3_layout.html I:回忆MVC2当中MasterPage ...

  4. Android 布局学习之——Layout(布局)具体解释二（常见布局和布局參数）

     [Android布局学习系列]   1.Android 布局学习之--Layout(布局)具体解释一   2.Android 布局学习之--Layout(布局)具体解释二(常见布局和布局參数)   ...

  5. 一天搞定CSS：支持IE的Layout布局--16

    1.BFC和Layout区别: BFC和Layout的作用是一样的,只是对浏览器的支持不同而已. BFC- -标准浏览器所具有的 Layout- -IE浏览器所具有的 BFC详解地址:http://b ...

  6. 解决thymeleaf layout布局不生效

    今天使用thymeleaf layout布局时总是不生效,特此把解决问题的步骤和几个关键点记录下来备忘. 一.检查依赖 1.thymeleaf必备maven依赖: <dependency> ...

  7. easyui中datagrid+layout布局

    1.掌握layout布局 首先,layout布局的具体使用可参考官网http://www.jeasyui.net/plugins/162.html layout布局分为东南西北中五个区域,如图我们将其 ...

  8. Springboot 使用thymeleaf模板layout布局

    使用layout布局前应该在pom文件中导入thymeleaf(dialect)依赖:如下 <properties> <project.build.sourceEncoding> ...

  9. easyui layout布局的属性说明

    layout布局的属性说明: 名称 类型 描述 默认值 fit boolean 当设置为 true 时,就设置布局(layout)的尺寸适应它的父容器.当在 'body' 标签上创建布局(layout ...

  10. Android开发中遇到的问题(二)——新建android工程的时候eclipse没有生成MainActivity和layout布局

    一.新建android工程的时候eclipse没有生成MainActivity和layout布局 最近由于工作上的原因,开始学习Android开发,在入门的时候就遇到了不少的坑,遇到的第一个坑就是&q ...

随机推荐

  1. 竞价广告系统-逻辑回归优化方法-L-BFGS

    逻辑回归优化方法-L-BFGS 逻辑回归的优化方法是一个经典的问题,如果我们把它视为一个最大熵模型,那么我们知道最早的优化方法是IIS,这个方法就不细讲了,因为它速度很慢.后来发现在最优化领域中非常常 ...

  2. 转-Linux系统下安装rz/sz命令及使用说明

    时间: 2013/03/20 | 分类: Linux常用命令 | 作者: 李坏 | 浏览:39,146 | 评论:5   对于经常使用Linux系统的人员来说,少不了将本地的文件上传到服务器或者从服务 ...

  3. SQL Server 如何读写数据

    01. SQL Server 如何读写数据   一. 数据读写流程简要SQL Server作为一个关系型数据库,自然也维持了事务的ACID特性,数据库的读写冲突由事务隔离级别控制.无论有没有显示开启事 ...

  4. Java Concurrency (1)

    Memory that can be shared betweenthreads is called shared memory or heap memory. The term variable a ...

  5. listView 分页加载数据

    Android应用 开发中,采用ListView组件来展示数据是很常用的功能,当一个应用要展现很多的数据时,一般情况下都不会把所有的数据一次就展示出来,而是通过分页 的形式来展示数据,个人觉得这样会有 ...

  6. C语言序列点浅析

    摘要: 现行国内的C语言教材普遍不介绍序列点,这使得读者只能“死记硬背”有序列点表达式的求值顺序,不仅造成了读者对C语言知识的认知残缺不全,而且也影响了读者学习的积极性.本文总结了序列点的作用,即表达 ...

  7. IOS设计模式学习（7）单例

    1 前言 数学与逻辑学中,singleton定义为“有且仅有一个元素的集合”.因此不管袋子有多大,每次从里面取出弹子的时候,拿到的都是同一个. 2 详述 2.1 简述 面向对象应用程序中的单例类(si ...

  8. [转] 数据库加锁 sql加锁的

    [导读: 各种大型数据库所采用的锁的基本理论是一致的,但在具体实现上各有差别.SQL Server更强调由系统来管理锁.在用户有SQL请求时,系统分析请求,自动在满足锁定条件和系统性能之间为数据库加上 ...

  9. Java核心技术 卷Ⅰ 基础知识（1）

    第三章 Java的基本程序设计结构 Java对大小写敏感 命名规范为骆驼命名法,不能使用保留字 main方法必须声明为public 如果main方法正常退出,java应用程序的退出代码为0,表示成功运 ...

  10. .NET基础——循环、枚举

    1. 循环结构 3种循环语句:while.do-while.for 面对循环我们应当注意: 1. 循环在做什么?(重复做的事情——也就是循环体的内容) 2. 循环的终止条件是什么?(循环条件) 3种循 ...