<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
的定义 对Ext.Viewport的layout 会有影响.
code:HTML/JSP代码
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Tabs Example</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<!-- GC -->
<!-- LIBS -->
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<!-- ENDLIBS -->
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript">
var viewport = new Ext.Viewport({
layout:'border',
items:[
{
region:'center',
contentEl: 'rightDiv',
split:true,
margins:'0 0 0 0',
collapsible : false,
titlebar: false,
animate: true
},{
region:'west',
contentEl: 'leftDiv',
split:true,
width: 500,
//height: 500,
//minSize: 500,
//maxSize: 500,
//margins:'0 0 0 0',
titlebar: false,
collapsible: false
}]
});
</script>
</head>
<body>
<div id='leftDiv' >
</div>
<div id='rightDiv'>
</div>
</body>
</html>
DTD 头 会影响viewport的正常渲染.
solution:
1.更换:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2.直接移除.
分享到:
相关推荐
### ext4.2学习之路:深入理解Ext JS 4.2框架 #### 一、Ext JS 4.2概述 Ext JS是一款强大的企业级富客户端Web应用程序开发框架,基于JavaScript和HTML5技术,用于构建高性能的桌面和移动Web应用程序。Ext JS 4.2...
使用Ext.Viewport搭一个简单布局(用一个小例子来总结本文所有内容) 面板是ExtJs控件的基础,很多控件都是在面板的基础上扩展的,或者他会与其他控件之间有关系。 面板由一个工具栏、一个底部工具栏、面板头部、面板...
Ext2.0的学习笔记不仅涵盖了Ajax的基本概念和应用,还深入探讨了如何利用Ajax技术与远程服务器进行数据交换,以及如何使用`ViewPort`来优化Web应用的布局和响应性。掌握这些知识对于开发高性能、高用户体验的Web应用...
模拟登录界面,加入验证码,xml树的实现 Ext viewport框架 等好多东西,都是自己在学习ext中想到什么就做个例子,只是有点乱,共同研究共同进步 在javascript目录下加入Ext2.0 在lib下加入所需要的jar 数据库是...
6.2. ViewPort对整个窗口布局 6.3. 脑袋上有几个标签的tabPanel 6.4. 让布局复杂一点儿 6.5. 向诸位介绍一下各具特色的布局 6.5.1. accordion就是QQ那样的伸缩菜单 6.5.2. CardLayout?其实就是Wizard啦。 6.5.3. 呼...
### Ext3.0 最经典的学习教程 #### 一、引言 Ext3.0是一款流行的JavaScript库,主要用于构建Ajax驱动的交互式Web应用程序。这款框架以其丰富的组件集合、灵活的布局选项以及强大的功能而闻名。《Ext3.0最经典的学习...
EXT的开发文档是学习EXT的重要资源,它包含了详细的API参考、教程和示例。以下是一些关键部分: 1. **API参考**: API参考文档列出了EXT的所有类、方法、属性和事件。通过查阅API,可以了解如何使用特定的组件和功能...
Ext.create('Ext.container.Viewport', { layout: 'fit', items: [{ title: 'HelloExt', html: 'Hello! Welcome to ExtJS.' }] }); } }); ``` 2. **创建HelloWorld.html文件**:同样在`WebRoot`目录下...
ssh-orcale-ext 实现ext的分页,grid的编辑并异步保存...以及viewport等一些ext的基础知识,算是学了两个星期的小结吧。 对新手应该会有帮助。一个完整的工程, 带有.sql文件,导入表和数据,修改数据库连接就能运行。
### ext学习之路:深入解析ExtJS 4.20的核心组件与应用 #### 构建与源码(build & source) 在深入探索ExtJS 4.20之前,理解其构建方式与源码结构至关重要。ExtJS的构建过程通常涉及将源代码编译成适合生产环境的...
Ext.create('Ext.container.Viewport', { layout: 'fit', items: [{ title: 'Hello Ext', html : 'Hello! Welcome to Ext JS.' }] }); } }); ``` - 创建helloworld.html,引入必要的CSS和JavaScript文件...
### Ext组件概述与初学者指南 #### 一、Ext组件概览 Ext是一个功能丰富的JavaScript框架,用于构建桌面级Web应用程序...对于初学者来说,逐步学习并实践每个组件的特性和用法,是成为一个合格的Ext开发者的关键步骤。
2. **层级结构**:类名中体现组件的层级关系,如`Ext.container.Viewport`表示视口容器。 3. **功能描述**:类名会包含组件的主要功能,如`Ext.toolbar.Toolbar`表示工具栏。 4. **继承关系**:EXT类名有时会体现出...
通过`Ext.container.Viewport`或`Ext.Component`创建视图,并通过数据绑定将模型数据呈现到界面上。 3. **控制器(Controller)**: 控制器作为模型和视图之间的纽带,处理用户交互,更新模型数据,以及管理视图的...
在本文中,我们将深入探讨如何使用EXT Java技术创建一个登录案例。EXT Java是一个强大的JavaScript库,专门用于构建富客户端Web应用程序...通过不断实践和学习EXT Java,你可以创建出更复杂、功能更丰富的Web应用程序。
至于提供的文件,"Ext4js整合springMVC生成添加表单.docx"可能包含了关于如何使用Ext4JS创建添加表单的详细步骤和示例代码,而"ext4js_springMVC添加表单.rar"可能是一个包含示例项目的压缩包,供开发者参考和学习。...
1. **创建Hello World应用**:在WebRoot目录下建立一个名为`helloworld.js`的文件,输入Ext4.0的`application`配置代码,定义应用名称和启动函数,创建一个带有标题和内容的`Viewport`容器。 2. **HTML结构**:创建`...
1. **配置Viewport**:通过`Ext.application`方法的`views`配置项或`viewport`配置项指定Viewport类。 2. **自适应布局**:利用ExtJS的布局管理器,如`fit`布局或`border`布局,使内容自动适应Viewport的大小。 3....