EXT--Ext.layout.container 标准布局类

最新推荐文章于 2020-05-18 15:30:12 发布

iteye_4927

最新推荐文章于 2020-05-18 15:30:12 发布

阅读量131

点赞数

CC 4.0 BY-SA版权

分类专栏： EXT 文章标签： xhtml javascript ViewUI

本文链接：https://blog.youkuaiyun.com/iteye_4927/article/details/82542205

EXT 专栏收录该内容

38 篇文章

订阅专栏

本文通过一个具体的示例展示了如何使用ExtJS框架实现自适应布局，包括使用Ext.panel.Panel组件并设置layout属性为'fit'来确保内容能够根据窗口大小自动调整。示例中还包含了基本的HTML和JavaScript代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>自适应布局</title> 
<link rel="stylesheet" href="ext-4.2.1/resources/css/ext-all.css" /> 
<script type="text/javascript" src="ext-4.2.1/bootstrap.js"></script>  
<script type="text/javascript" src="ext-4.2.1/locale/ext-lang-zh_CN.js"></script> 
<script type="text/javascript"> 
Ext.onReady(function(){ 
Ext.create('Ext.panel.Panel',{ 
title:'Ext.layout.container.Fit', 
frame:true, 
renderTo:Ext.getBody(), 
bodyPadding:5, 
width:200, 
              //  layout:'auto',//自动布局 
layout:'fit', //自适应布局 
               // layout:'accordion', //折叠布局 
defaults:{ 
bodyStyle:'background-color:#FFFFFF' 
}, 
//面板items配置项默认的xtype类型为panel 该默认值可以通过defaultType配置项进行更改 
items:[{ 
title:'嵌套面板一', 
html:'面板一' 
},{ 
title:'嵌套面板二', 
html:'面板二' 
}] 

}); 
}); 
</script> 
</head> 
<body> 
</body> 
</html>

开发者博客：www.developsearch.com