ExtJs布局中，控件如何水平居中

分享一下我老师大神的人工智能教程！零基础，通俗易懂！http://blog.csdn.net/jiangjunshow

也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！

                       

如此即可，有图有代码有j8:

var formGridHead = Ext.create('Ext.form.Panel', {        id: 'MyGridHead',        region: 'north',        bodyPadding: 10,        bodyStyle: 'background:#fff',        split: false,        header: false,        collapsible: true,        items: [                { xtype: 'panel'                , border: false                , layout: {                    type: 'vbox',                    align: 'center'                }, width: '100%', items: [                {                    xtype: 'fieldcontainer'                    , layout: 'column'                    , items: [{    xtype: 'button',    text: '<span class="hydg_btn">标准查询</span>',    scale: 'medium',    id: 'btnSearchOption',    listeners: {        click: {    }}}, { html: '', border: false, width: 30 }, {    xtype: 'button',    text: '<span class="hydg_btn">高级查询</span>',    scale: 'medium',    id: 'btnSearchOptionPower',    listeners: {        click: {    }}}, { html: '', border: false, width: 30 }                        , {                            xtype: 'button',                            text: '<span class="hydg_btn">浏览统计图</span>',                            scale: 'medium',                            id: 'btnViewTongji',                            listeners: {                                click: {                            }                        }                    }                        ]                }                    ]                }            ]    });
  
  
  

   
1
   
2
   
3
   
4
   
5
   
6
   
7
   
8
   
9
   
10
   
11
   
12
   
13
   
14
   
15
   
16
   
17
   
18
   
19
   
20
   
21
   
22
   
23
   
24
   
25
   
26
   
27
   
28
   
29
   
30
   
31
   
32
   
33
   
34
   
35
   
36
   
37
   
38
   
39
   
40
   
41
   
42
   
43
   
44
   
45
   
46
   
47
   
48
   
49
   
50
   
51
   
52
   
53
   
54
   
55
  

其中重点在于：

, layout: {                    type: 'vbox',                    align: 'center'                }, width: '100%',
  
  
  

   
1
   
2
   
3
   
4
  

           

给我老师的人工智能教程打call！http://blog.csdn.net/jiangjunshow

你好！ 这是你第一次使用 **Markdown编辑器** 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。

新的改变

我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：

1. 全新的界面设计 ，将会带来全新的写作体验；
2. 在创作中心设置你喜爱的代码高亮样式，Markdown 将代码片显示选择的高亮样式 进行展示；
3. 增加了 图片拖拽 功能，你可以将本地的图片直接拖拽到编辑区域直接展示；
4. 全新的 KaTeX数学公式 语法；
5. 增加了支持甘特图的mermaid语法¹