ExtJs布局之BOX
<!DOCTYPE html>
<html>
<head>
<title>ExtJs</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
<script type="text/javascript" src="ExtJs/ext-all.js"></script>
<script type="text/javascript" src="ExtJs/bootstrap.js"></script>
<script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script>
<script type="text/javascript">
Ext.onReady(function() {
Ext.create('Ext.panel.Panel',{
title: 'Ext.layout.container.Table',
frame: true,
height: 600,
width: 800,
renderTo: Ext.getBody(),
layout: {
type: 'hbox',
align: 'stetch'
},
items: [{
title: '子面板一',
flex: 1,
html: '1/4宽(flex=1)'
},{
title: '子面板二',
flex: 1,
html: '1/4宽(flex=1)'
},{
title: '子面板三',
flex: 2,
html: '2/4宽(flex=2)'
}]
});
});
</script>
</head>
<body>
<div id='form'></div>
<div id='form1'></div>
</body>
</html>

ExtJs布局之BOX的更多相关文章
- CSS3-弹性盒布局(Flex Box)
弹性盒布局(Flex Box) 一.概念 弹性盒子是 CSS3 的一种新的布局模式. CSS3 弹性盒( Flexible Box 或 flexbox),是一种当页面需要适应不同的屏幕大小以及设备类型 ...
- ExtJs布局详解
序言 1.百度百科上说:ExtJs功能丰富,无人能出其右.无论是界面之美,还是功能之强,extjs都高居榜首. 2.呵呵,界面之美当是少不了布局的,这篇文章我写layout的七种布局.(extjs是4 ...
- CSS3弹性伸缩布局(一)——box布局
CSS3弹性伸缩布局简介 2009年,W3C提出了一种崭新的方案----Flex布局(即弹性伸缩布局),它可以简便.完整.响应式地实现各种页面布局,包括一直让人很头疼的垂直水平居中也变得很简单地就迎刃 ...
- Extjs布局
今天我来总结一下extjs下面的各种布局,不仅是为了给自己做笔记,同时,也希望让刚刚接触extjs的朋友们快速的了解下,大神就不用看了.废话不多说,开始布局的讲解. (以下代码都可以直接在javasc ...
- CSS:CSS弹性盒子布局 Flexible Box
一.简介 flexbox:全称Flexible Box, 弹性盒子布局.可以简单实现各种伸缩性的设计,它是由伸缩容器和伸缩项目组成.任何一个元素都可以指定为flexbox布局.这种新的布局方案在200 ...
- ExtJS布局控件
Layout Controls Auto Layout Ext JS4中的容器的默认布局是自动布局.这个布局管理器会自动地将组件放在一个容器中. Fit Layout Fit布局安排了容器的内容完全占 ...
- ExtJS布局方式(layout)图文详解
Auto默认布局 不给下级组件指定大小和位置 Absolute绝对布局 可使用坐标(x.y)进行布局 Accordion手风琴布局 实现Accordion效果的布局,也可叫可折叠布局.也就是说使用该布 ...
- ExtJs布局之tabPanel
<!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv ...
- ExtJs布局之viewport
<!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv ...
随机推荐
- Android--获取使用的总流量和每个App的上传、下载的流量
获得每个App的上传.下载的流量. 思路就是获取到我们手机上的所有app,再获得app里面使用的权限,如果app有网络权限,就显示出来. 代码很简单,代码里面也有比较详细的注释,下面直接上代码 布局文 ...
- Swift 类构造器的使用
Swift 中构造器需要遵循的规则还是很多的, 总结一下, 有以下规则: 调用相关 指定构造器必须调用它直接父类的指定构造器方法. 便利构造器必须调用同一个类中定义的其它初始化方法. 便利构造器在最后 ...
- 实体框架 (EF) 入门 => 六、性能注意事项
这个还真是复杂,看了看微软的文档,有些根本就看不懂,有些能看懂,但对我这种菜鸟也不会去用. 无从下手啊,前面放了几个链接,挨个试试吧. 一.显式打开连接 这个我测试过,有些时候,需要我们显示打开连接, ...
- 28335 sci fifo send
#include "DSP2833x_Device.h"#include "DSP2833x_Examples.h"char buf[]={0x30,0x32, ...
- NSString+NSStringForJava.m
// // NSString+NSStringForJava.m // NSStringCategory // // Created by Ryan Tang on 12-10-17. // Copy ...
- JBOSS和WebLogic区别
JBoss: 1. JBoss开放源代码Java EE实现,成本低,好控制. 2. JBoss需要的内存和硬盘空间比较小,但是只适合做小项目. 3. 安装非常简单.先解压缩JBoss打包文件再配 ...
- Careercup - Google面试题 - 5085331422445568
2014-05-08 23:45 题目链接 原题: How would you use Dijkstra's algorithm to solve travel salesman problem, w ...
- UIKit 框架之UISearchController
// // tableViewController.m // searchController // // Created by City--Online on 15/6/1. // Copyrigh ...
- Netsharp快速入门(之1) 介绍及需求说明
作者:秋时 杨昶 时间:2014-02-15 转载须说明出处 第一章 快速入门介绍 Netsharp是一个企业基础业务管理平台,介绍Netsharp分三个系列,分别是: 1. N ...
- xcode 运行报错 Command /usr/bin/codesign failed with exit code 1
因为更换了证书,导致在运行时报错 Command /usr/bin/codesign failed with exit code 1,查看了网上各种方法,最后发现以下两个值没有同步更新