案例：ionic案例     状态：可编辑再运行    进入竖版
 运行结果　
​x
 
1
<html>
2
    <head>
3
        <meta charset="utf-8">
4
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
5
        <title>W3xue教程(w3xue.com)</title>
6
        <link href="https://cdn.bootcss.com/ionic/1.3.2/css/ionic.css" rel="stylesheet">
7
        <script src="https://cdn.bootcss.com/ionic/1.3.2/js/ionic.bundle.min.js"></script>
8
    </head>
9
    <body ng-app="todo" ng-controller="TodoCtrl">
10
    <ion-side-menus>
11
​
12
    <!-- 中心内容 -->
13
    <ion-side-menu-content>
14
      <ion-header-bar class="bar-dark">
15
        <h1 class="title">Todo</h1>
16
      </ion-header-bar>
17
      <ion-content>
18
        <!-- 列表 -->
19
        <ion-list>
20
          <ion-item ng-repeat="task in tasks">
21
            {{task.title}}
22
          </ion-item>
23
        </ion-list>
24
      </ion-content>
25
    </ion-side-menu-content>
26
​
27
    <!-- 左侧菜单 -->
28
    <ion-side-menu side="left">
29
      <ion-header-bar class="bar-dark">
30
        <h1 class="title">Projects</h1>
31
      </ion-header-bar>
32
    </ion-side-menu>
33
​
34
    </ion-side-menus>
35
    <script src="/js/ionic1.0.1/app.js"></script>
36
    <script src="cordova.js"></script>
37
</body>
38
</html>
39
​