ionic 头部内容 尾部

简介: ionic 头部内容 尾部

引入

ionic 的css js 和angularJS 这三个文件

头部写法

1. <ion-header-bar align-title="center" class="bar-positive">
2.                <div class="buttons">
3.                    <button class="button" ng-click="doSomething()">左侧按钮</button>
4.                </div>
5.                <h1 class="title">Title!</h1>
6.                <div class="buttons">
7.                    <button class="button">右侧按钮</button>
8.                </div>
9.            </ion-header-bar>

内容区域

1. <ion-content>
2.      一些内容!
3.    </ion-content>

尾部区域

1. <ion-footer-bar align-title="left" class="bar-positive">
2.      <div class="buttons">
3.        <button class="button">左侧按钮</button>
4.      </div>
5.      <h1 class="title">Title!</h1>
6.      <div class="buttons" ng-click="doSomething()">
7.        <button class="button">右侧按钮</button>
8.      </div>
9.    </ion-footer-bar>

 

相关文章
|
6月前
|
前端开发
当当网头部和尾部——CSS源码
当当网头部和尾部——CSS源码
|
3月前
|
移动开发 HTML5
HTML5文档头部相关标记
【8月更文挑战第28天】HTML5文档头部相关标记。
39 1
|
6月前
|
监控 Linux
linux(十六)文件和目录相关命令-查看文件头部内容head与查看文件尾部内容tail
linux(十六)文件和目录相关命令-查看文件头部内容head与查看文件尾部内容tail
130 0
|
6月前
|
前端开发 JavaScript 搜索推荐
头部
头部
30 4
|
6月前
|
移动开发 HTML5
HTML5文档头部相关标记
【2月更文挑战第9天】HTML5文档头部相关标记。
35 1
如何实现一个网页头部图标
如何实现一个网页头部图标
34 0
|
JavaScript
用nodejs实现向文件的固定位置插入内容
用nodejs实现向文件的固定位置插入内容
111 0
ADI
|
前端开发
[记录] CSS布局-绝对尾部
[记录] CSS布局-绝对尾部
ADI
95 0