ExtJS学习笔记四:综合实例登陆框

来源:互联网 发布:视频打码软件 编辑:程序博客网 时间:2024/05/18 04:51
<style type="text/css">
*{
margin:0;
padding:0;
}
.contain{
width:100%;
height:100%;
top:0;
left:0;
}
.center{
width:260px;
height:130px;
margin:20% auto;
}
</style>
<script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext/ext-all.js"></script>
<script type='text/javascript'>
Ext.onReady(function() {
var panel = new Ext.Panel({
//始终要记住,要想显示你创建的组件,第一要穿件组件,第二要显示
//renderTo:Ext.getBody(),
title:"登    陆",
frame:true,//直角变成圆角,还有其他变化
layout:"form",
labelWidth:45,
defaults:{xtype:"textfield",width:180},
items:[
      {fieldLabel:"账   号"},{fieldLabel:"密    码"}
      ],
buttons:[
        {text:"确   定"},{text:"取  消"}
        ]
});
panel.applyToMarkup(Ext.DomHelper.append(Ext.getBody(),{
tag:"div",
cls:"contain",
cn:[{//我理解的时child-node
tag:"div",
cls:"center"
}]
//true代表返回的时Ext的元素
},true).child("div"));
});
</script>
原创粉丝点击