<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
</head>
<body>
<script>
Ext.onReady(function(){
new Ext.Panel({
renderTo:'show',//填充到id为show的区域
title:'fit布局的面板',
layout:'fit',//声明为fit布局
width:500,
height:200,//无论我将panel的宽度,高度设为多少,子元素都将自适应面板大小,自动填充全部区域
items:[{
title:'内容',
html:'我的大小是自适应面板大小的'
}]
});
});
</script>
<div id='show'></div>
</body>
</html>
<html>
<head>
<title> New Document </title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
</head>
<body>
<script>
Ext.onReady(function(){
new Ext.Panel({
renderTo:'show',//填充到id为show的区域
title:'fit布局的面板',
layout:'fit',//声明为fit布局
width:500,
height:200,//无论我将panel的宽度,高度设为多少,子元素都将自适应面板大小,自动填充全部区域
items:[{
title:'内容',
html:'我的大小是自适应面板大小的'
}]
});
});
</script>
<div id='show'></div>
</body>
</html>
运行以上代码,将产生如下效果:
怎么样?jack还是很厉害的吧,考虑的真周全啊~~
