案例: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
            height: 300,
11
            width: 600,
12
            layout:'border',
13
            defaults: {
14
               collapsible: true,
15
               split: true,
16
               bodyStyle: 'padding:15px'
17
            },
18
            items: [{
19
               title: 'Panel1',
20
               region:'west',
21
               html: 'This is Panel 1'
22
            },{
23
               title: 'Panel2',
24
               region:'center',
25
               html: 'This is Panel 2'
26
            },{
27
               title: 'Panel3',
28
               region: 'south',
29
               html: 'This is Panel 3'
30
            },{
31
               title: 'Panel4',
32
               region: 'east',
33
               html: 'This is Panel 4'
34
            },{
35
               title: 'Panel5',
36
               region: 'north',
37
               html: 'This is Panel 5'
38
            }]
39
         });
40
      });
41
   </script>
42
</head>
43
<body>
44
</body>
45
</html>