jQuery EasyUI布局容器layout实例精讲
这个布局容器,有五个区域:北、南、东、西和中心。 他中心地区面板是必需的,但是边缘地区面板是可选的。每一个边缘地区面板可以缩放的拖动其边境, 他们也可以通过点击其收缩触发.布局可以嵌套,从而用户可以建立他想要的复杂的布局。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实例精讲的更多相关文章
- jQuery EasyUI 选项卡面板tabs使用实例精讲
1. 对选项卡面板区域 div 设置 class=”easyui-tabs” 2. 对选项卡面板区域添加多个 div,每个 div 就是一个选项卡(每个面板一定设置 title) 3. 设置面板 fi ...
- jQuery EasyUI window窗口使用实例
需求:点击[增加]按钮,弹出窗口,并对所有输入项内容进行校验,校验通过就提交给后台的action处理,没有通过校验就弹窗提示. <!DOCTYPE html> <html> ...
- plsql实例精讲部分笔记
转换sql: create or replace view v_sale(year,month1,month2,month3,month4,month5,month6,month7,month8,mo ...
- 布局容器layout Container
画布canvas 盒子Box VBox Hbox-->HGroup VGroup 控制条 ControlBar
- (转)jquery easyui treegrid使用小结 (主要讲的是如何编辑easyui中的行信息包括添加 下拉列表等)
在实际应用中可能会碰到不同的需求,比如会根据每行不同的参数或属性设置来设置同列不同的editor类型,这时原有的例子就显的有点太过简单,不能实现我们的需求,现在应用我在项目中的操作为例,显示下实现同列 ...
- MySQL创建用户与授权方法实例精讲
MySQL中创建用户与授权的实现方法. 运行环境:widnows xp professional + MySQL5.0 一, 创建用户: 命令:CREATE USER 'username'@'host ...
- Android——Fragment实例精讲——底部导航栏+ViewPager滑动切换页面
说明: 实现效果: 1- 用ViewPager实现Fragmen之间的切换 2- 底部用RadioGroup实现,更方便的实现图片和字体颜色的改变,更方便的通过RadioButton的点击事件来控制页 ...
- EasyUI学习总结(六)——EasyUI布局
一.EasyUI布局介绍 easyUI布局容器包括东.西.南.北.中五个区域,其中中心面板是必须的,而东.西.南.北这四个面板是可选的,如果布局里面不需要东.西.南.北这四个面板,那么可以把相应的di ...
- EasyUI学习总结(六)——EasyUI布局(转载)
本文转载自:http://www.cnblogs.com/xdp-gacl/p/4088198.html 一.EasyUI布局介绍 easyUI布局容器包括东.西.南.北.中五个区域,其中中心面板是必 ...
随机推荐
- (转)Spring Boot (十九):使用 Spring Boot Actuator 监控应用
http://www.ityouknow.com/springboot/2018/02/06/spring-boot-actuator.html 微服务的特点决定了功能模块的部署是分布式的,大部分功能 ...
- P2080 增进感情(背包DP)
思路:将好感度x+y作为体积, 幸福度x-y作为作为价值, 然后就是一个经典的背包问题了.emmmmm,还可以特判一下,因为幸福度为0时就是最小了,没有必要看后面的了吧. 其实,我自己做的时候,沙雕的 ...
- mysql执行顺序
SELECT语句执行顺序 SELECT语句中子句的执行顺序与SELECT语句中子句的输入顺序是不一样的,所以并不是从SELECT子句开始执行的,而是按照下面的顺序执行: 开始->FROM子句-& ...
- Linux 文件系统管理
Linux 文件系统管理 课程大纲 文件系统构成及命令 硬盘分区及管理 磁盘配额 备份与恢复 文件系统构成 /usr/bin ./bin:存放所有用户可以执行的命令 /usr/s ...
- ubantu下Navicat乱码的问题
在官网下载的最新版的Navivat12出现的乱码情况 解决方法:Navicat的文件夹中找到start_navicat用vim编辑,在export LANG=“en_US.UTF-8”这句话改为exp ...
- docker 13 dockerfile的保留字指令
Dockerfile是用来构建Docker镜像的构建文件,是由一系列命令和参数构成的脚本. 构建三步骤:1.编写dockerfile文件:2.docker build:3.docker run doc ...
- [Micropython] TPYBoard STM32F407开发板运行第一个脚本
从这篇教程开始将动手在TPYBoard STM32F407开发板上运行 Python 脚本,下面教大家拿到这个开发板后怎么用!(该款开发板某宝上有售) 1 连接开发板 通过 USB 线连接你的 PC ...
- Vue-组件使用细节
一.用is指定组件为特定的原生HTML元素. html: <div id="app"> <table> <tbody> <item> ...
- 如何备份和恢复你的TFS服务器(二)
配置一个备份计划 在你的TFS(Team Foundation Server)2010服务器上安装新版本的Power Tools以后(是的,这个工具只支持TFS(Team Foundation Ser ...
- RPC与Zookeeper注册中心的简单实现
连接上文:https://www.cnblogs.com/wuzhenzhao/p/9962250.html RPC框架的简单实现,基于这个小程序,在我学习完Zookeeper之后如何将注册中心与RP ...