layout布局
<!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布局的更多相关文章
- 新建android工程的时候eclipse没有生成MainActivity和layout布局
一.新建android工程的时候eclipse没有生成MainActivity和layout布局 最近由于工作上的原因,开始学习Android开发,在入门的时候就遇到了不少的坑,遇到的第一个坑就是&q ...
- layout布局实例化
实例化xml中的Layout布局在开发中经常会用到,有几种方法可以使用 1.在Activity中使用getLayoutInflater()方法 View layout = getLayoutInfla ...
- ASP.NET MVC3 系列教程 – 新的Layout布局系统
原文地址:http://www.cnblogs.com/highend/archive/2011/04/18/asp_net_mvc3_layout.html I:回忆MVC2当中MasterPage ...
- Android 布局学习之——Layout(布局)具体解释二(常见布局和布局參数)
[Android布局学习系列] 1.Android 布局学习之--Layout(布局)具体解释一 2.Android 布局学习之--Layout(布局)具体解释二(常见布局和布局參数) ...
- 一天搞定CSS:支持IE的Layout布局--16
1.BFC和Layout区别: BFC和Layout的作用是一样的,只是对浏览器的支持不同而已. BFC- -标准浏览器所具有的 Layout- -IE浏览器所具有的 BFC详解地址:http://b ...
- 解决thymeleaf layout布局不生效
今天使用thymeleaf layout布局时总是不生效,特此把解决问题的步骤和几个关键点记录下来备忘. 一.检查依赖 1.thymeleaf必备maven依赖: <dependency> ...
- easyui中datagrid+layout布局
1.掌握layout布局 首先,layout布局的具体使用可参考官网http://www.jeasyui.net/plugins/162.html layout布局分为东南西北中五个区域,如图我们将其 ...
- Springboot 使用thymeleaf模板layout布局
使用layout布局前应该在pom文件中导入thymeleaf(dialect)依赖:如下 <properties> <project.build.sourceEncoding> ...
- easyui layout布局的属性说明
layout布局的属性说明: 名称 类型 描述 默认值 fit boolean 当设置为 true 时,就设置布局(layout)的尺寸适应它的父容器.当在 'body' 标签上创建布局(layout ...
- Android开发中遇到的问题(二)——新建android工程的时候eclipse没有生成MainActivity和layout布局
一.新建android工程的时候eclipse没有生成MainActivity和layout布局 最近由于工作上的原因,开始学习Android开发,在入门的时候就遇到了不少的坑,遇到的第一个坑就是&q ...
随机推荐
- Aliexpress API 授权流程整理
Aliexpress API 授权流程整理 前言 我零零总总用了好几个月的时间,写了一个自用的小程序,从 Aliexpress 上抓取订单的小程序.刚开始写的时候,该API还没有开放,而且没有订单 ...
- 鸟哥的LINUX私房菜基础篇第三版 阅读笔记 一
1. Linux的档案权限与目录配置 一.基础知识: a.分为三类,拥有者(owner).群组(group).其他人(other) b.三个核 ...
- Combo模糊匹配中文问题
茗洋Easy UI 1.3.2 部分问题解决系列专题[Combo模糊匹配中文问题 修复] 本次给大家带来的EasyUI的我研究拓展的新特性 我使用的是 EasyUI 1.3.2版本的,项目是ASP. ...
- HtmlAgilityPack实战代码
C#采集代理服务器ip并设置IE代理--HtmlAgilityPack实战代码 今天在博客园看到一篇文章,说是C#采集某某的数据,其实做采集小软件很久了, 用的最好的还是HtmlAgilityPack ...
- 超级强悍的PHP代码编辑器PHPstorm及配置
如何下载安装 官方网站:http://www.jetbrains.com/phpstorm/,本篇文章展示的是5.0版本以,所以,如果你的软件版本过高,可能可有误,所以,如果有问题,请在本站留言,做为 ...
- android自定义View---生成虚线的View
1.在res/values/目录下 新建文件 attrs.xml <? xml version = "1.0" encoding = "utf-8&q ...
- android调用js
1.android中利用webview调用网页上的js代码. Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true ...
- 简洁AngularJS框架后台管理系统bootstrap后台模板
最近在做一个后台管理的项目,但是没有设计图完全,所以就发现一款非常不错的模版. 这个模版是基于 AngularJS 和 bootstrap 的后台管理系统模版. Minovate是 AngularJS ...
- JS —— 轮播图中的缓动函数的封装
轮播图的根本其实就是缓动函数的封装,如果说轮播图是一辆跑动的汽车,那么缓动函数就是它的发动机,今天本文章就带大家由简入繁,封装属于自己的缓动函数~~ 我们从需求的角度开始,首先给出一个简单需求: 1. ...
- 回溯法、数独与N阶可达问题
回溯法是剪了枝的穷举,这是字面上的说法,不太好理解,不如讲解实例来的酸爽,于是引出了N阶可达问题: 有N个国家,每个国家有若干城市,小明要从中国(任意一个城市)出发,遍历所有国家(假设这个遍历顺序已经 ...