<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Label布局</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link type="text/css" rel="stylesheet" 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>
<script type="text/javascript">
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel([
{header:'纳税人名称',dataIndex:'id',sortable:true},
{header:'计划巡查时间',dataIndex:'name',width:200},
{header:'纳税人状态',dataIndex:'descn',width:200}
]);
var data = [
['1','name1','descn1'],
['2','name2','descn2'],
['3','name3','descn3'],
['4','name4','descn4'],
['5','name5','descn5']
];
var store = new Ext.data.Store({
proxy: new Ext.data.MemoryProxy(data),
reader: new Ext.data.ArrayReader({}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
});
store.load();
var grid = new Ext.grid.GridPanel({
autoHeight: true,
store: store,
anchor:"90%",
style:'margin:10px 10px 10px 10px',
cm: cm
});
new Ext.Panel({
renderTo:Ext.getBody(),
height:400,
frame:true,
items:[new Ext.form.FormPanel({
defaultType:'textfield',
items:[{xtype:'panel',layout:'column',items:[
{xtype:'fieldset',columnWidth:.33,layout:'form',border:false,items:[
new Ext.form.Label({fieldLabel :'计划名称',text:'测试'}),
new Ext.form.Label({fieldLabel :'计划询问时间',text:'测试'})
]},
{xtype:'fieldset',columnWidth:.33,border:false,layout:'form',items:[
new Ext.form.Label({fieldLabel :'同行人名称',text:'测试'}),
new Ext.form.Label({fieldLabel :'计划创建时间',text:'测试'})
]},
{xtype:'fieldset',columnWidth:.33,border:false,layout:'form',items:[
new Ext.form.Label({fieldLabel :'巡查类别',text:'测试'}),
new Ext.form.Label({fieldLabel :'计划创建人',text:'测试'})
]}
]},new Ext.form.Label({fieldLabel :'计划内容',html:'测试'}),
grid,
new Ext.form.TextArea({fieldLabel:'计划审批意见',anchor:"90%"})
]
})]
});
})
</script>
<body>
</body>
</html>
这个是我的代码,按道理来讲label没问题,但是我运行是label的fieldLabel在第一行,text总是在第二行,不管怎么调都一样..
我用的是Ext3.0的就算我弄一个panel只放label还是会出现这个情况,是不是样式的问题呢?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Label布局</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link type="text/css" rel="stylesheet" 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>
<script type="text/javascript">
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel([
{header:'纳税人名称',dataIndex:'id',sortable:true},
{header:'计划巡查时间',dataIndex:'name',width:200},
{header:'纳税人状态',dataIndex:'descn',width:200}
]);
var data = [
['1','name1','descn1'],
['2','name2','descn2'],
['3','name3','descn3'],
['4','name4','descn4'],
['5','name5','descn5']
];
var store = new Ext.data.Store({
proxy: new Ext.data.MemoryProxy(data),
reader: new Ext.data.ArrayReader({}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
});
store.load();
var grid = new Ext.grid.GridPanel({
autoHeight: true,
store: store,
anchor:"90%",
style:'margin:10px 10px 10px 10px',
cm: cm
});
new Ext.Panel({
renderTo:Ext.getBody(),
height:400,
frame:true,
items:[new Ext.form.FormPanel({
defaultType:'textfield',
items:[{xtype:'panel',layout:'column',items:[
{xtype:'fieldset',columnWidth:.33,layout:'form',border:false,items:[
new Ext.form.Label({fieldLabel :'计划名称',text:'测试'}),
new Ext.form.Label({fieldLabel :'计划询问时间',text:'测试'})
]},
{xtype:'fieldset',columnWidth:.33,border:false,layout:'form',items:[
new Ext.form.Label({fieldLabel :'同行人名称',text:'测试'}),
new Ext.form.Label({fieldLabel :'计划创建时间',text:'测试'})
]},
{xtype:'fieldset',columnWidth:.33,border:false,layout:'form',items:[
new Ext.form.Label({fieldLabel :'巡查类别',text:'测试'}),
new Ext.form.Label({fieldLabel :'计划创建人',text:'测试'})
]}
]},new Ext.form.Label({fieldLabel :'计划内容',html:'测试'}),
grid,
new Ext.form.TextArea({fieldLabel:'计划审批意见',anchor:"90%"})
]
})]
});
})
</script>
<body>
</body>
</html>
这个是我的代码,按道理来讲label没问题,但是我运行是label的fieldLabel在第一行,text总是在第二行,不管怎么调都一样..
我用的是Ext3.0的就算我弄一个panel只放label还是会出现这个情况,是不是样式的问题呢?
xtype:'label',
text:'注意:........。',
width:400,
cls:'x-label',
anchor:'-25'
}
这样用
Ext.onReady(function() {
var cm = new Ext.grid.ColumnModel([
{ header: '纳税人名称', dataIndex: 'id', sortable: true },
{ header: '计划巡查时间', dataIndex: 'name', width: 200 },
{ header: '纳税人状态', dataIndex: 'descn', width: 200 }
]); var data = [
['1', 'name1', 'descn1'],
['2', 'name2', 'descn2'],
['3', 'name3', 'descn3'],
['4', 'name4', 'descn4'],
['5', 'name5', 'descn5']
]; var store = new Ext.data.Store({
proxy: new Ext.data.MemoryProxy(data),
reader: new Ext.data.ArrayReader({}, [
{ name: 'id' },
{ name: 'name' },
{ name: 'descn' }
])
});
store.load(); var grid = new Ext.grid.GridPanel({
autoHeight: true,
store: store,
anchor: "90%",
style: 'margin:10px 10px 10px 10px',
cm: cm
});
new Ext.Panel({
renderTo: Ext.getBody(),
height: 400,
items: [
{
xtype: "form", border: false,frame:true,
items: [{
layout: "column", border: false,
items: [
{
layout: "form", border: false, items: {
xtype: "fieldset", height: 80, title: "111111111111",
items: [
{ html: "计划名称:测试", border: false },
{ html: "计划询问时间:测试", border: false }
]
}, columnWidth: .33
},
{
layout: "form", border: false, items: {
xtype: "fieldset", height: 80, title: "22222222222",
items: [
{ html: "同行人名称:测试", border: false },
{ html: "计划创建时间:测试", border: false }
]
}, columnWidth: .33
},
{
layout: "form", border: false, items: {
xtype: "fieldset", height: 80, title: "333333333333333",
items: [
{ html: "巡查类别:测试", border: false },
{ html: "计划创建人:测试", border: false }
]
}, columnWidth: .33
}
]
},
new Ext.form.Label({ fieldLabel: '计划内容', html: '测试' }),
grid,
new Ext.form.TextArea({ fieldLabel: '计划审批意见', anchor: "90%" })
]
}
]
});
})另外建议直接用xtype写组件