案例:Extjs案例     状态:可编辑再运行    进入竖版
 运行结果 
AخA
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
   <link href="//cdn.bootcss.com/extjs/6.2.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" />
5
   <script type="text/javascript" src="//cdn.bootcss.com/extjs/6.2.0/ext-all.js"></script>
6
   <script type="text/javascript">
7
      Ext.onReady(function() {
8
         Ext.create('Ext.panel.Panel', {
9
            renderTo : Ext.getBody(),
10
            layout : {
11
               type :'hbox' 
12
            },
13
            requires: ['Ext.layout.container.HBox'],
14
            xtype: 'layout-horizontal-box',
15
            width : 600,
16
            frame :true,
17
            items : [{
18
               title: 'Panel 1',
19
               html : 'Panel with flex 1',
20
               flex : 1
21
            },{
22
               title: 'Panel 2',
23
               html : 'Panel with flex 2',
24
               flex : 2
25
            },{
26
               title: 'Panel 3',
27
               width: 150,
28
               html : 'Panel with width 150'
29
            },{
30
               title: 'Panel 4',
31
               html : 'Panel with flex 1',
32
               flex : 1
33
            }]
34
         });
35
      });
36
   </script>
37
</head>
38
<body>
39
</body>
40
</html>