- ionic 教程
- ionic 安装
- ionic 创建 APP
- ionic 头部与底部
- ionic 按钮
- ionic 列表
- ionic 卡片
- ionic 表单和输入框
- ionic toggle(切换开关)
- ionic checkbox
- ionic 单选框
- ionic range
- ionic select
- ionic tab(选项卡)
- ionic 网格(Grid)
- ionic 颜色
- ionic icon(图标)
- ionic 上拉菜单(ActionSheet)
- ionic 背景层
- ionic 下拉刷新
- ionic 复选框
- ionic 单选框操作
- ionic 切换开关操作
- ionic 手势事件
- ionic 头部和底部
- ionic 列表操作
- ionic 加载动作
- ionic 模态窗口
- ionic 导航
- ionic 平台
- ionic 浮动框
- ionic 对话框
- ionic 滚动条
- ionic 侧栏菜单
- ionic 滑动框
- ionic 加载动画
- ionic 选项卡栏操作
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
ionic 头部和底部
ion-header-bar
这个是固定在屏幕顶部的一个头部标题栏。如果给它加上'bar-subheader' 这个样式,它就是副标题。
用法
<ion-header-bar align-title="left"> <div> <button ng-click="doSomething()">Left Button</button> </div> <h1>Title!</h1> <div> <button>Right Button</button> </div> </ion-header-bar> <ion-content> Some content! </ion-content>
API
属性 | 类型 | 描述 |
---|---|---|
align-title (optional) | string | 这个是对齐 title 的。如果没有设置,它将会按照手机的默认排版(Ios的默认是居中,Android默认是居左)。它的值可以是 'left','center','right'。 |
no-tap-scroll (optional) | boolean | 默认情况下,头部标题栏在点击屏幕时内容会滚动到头部,可以将 no-tap-scroll 设置为 true 来禁止该动作。。它的值是布尔值(true/false)。 |
ion-footer-bar
知道了 ion-header-bar ,理解ion-footer-bar就轻松多啦!只是 ion-footer-bar 是在屏幕的底部。
用法
<ion-content> Some content! </ion-content> <ion-footer-bar align-title="left"> <div> <button>Left Button</button> </div> <h1>Title!</h1> <div ng-click="doSomething()"> <button>Right Button</button> </div> </ion-footer-bar>
API
与 ion-header-bar 不同的是,ion-footer-bar 只有 align-title 这个 API。属性 | 类型 | 描述 |
---|---|---|
align-title (optional) | string | 这个是对齐 title 的。如果没有设置,它将会按照手机的默认排版(Ios的默认是居中,Android默认是居左)。它的值可以是 'left','center','right'。 |
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论