jQuery Mobile 导航栏
作者:本站编辑 发布时间:2015-11-24 来源:本站原创
点击数:
默认情况下，导航栏中的链接将自动变成按钮（不需要 data-role="button"）。
使用 data-role="navbar" 属性来定义导航栏：
实例
<div data-role="header">
<div data-role="navbar">
<ul>
<li><a href="#anylink">首页</a></li>
<li><a href="#anylink">页面二</a></li>
<li><a href="#anylink">搜索</a></li>
</ul>
</div>
</div>
data-icon 属性与在图标章节中的 CSS 类使用相同的值。CSS 类使用方法 class="ui-icon-value", data-icon 属性使用方法 data-icon="value"。
|
|
|
| 属性值 | 描述 | 图标 |
|---|
| data-icon="home" | 首页 |
|
| data-icon="arrow-r" | 右边箭头 |
|
| data-icon="search" | 搜索 |
|
如需查看所有 jQuery Mobile 按钮图标的完整参考手册，请访问我们的 jQuery Mobile 图标参考手册。
定位图标
就像 "ui-btn-icon-position" 类一样 (图标章节有详细说明), 你可以设置图标显示的位置： top（头部）, right（右侧）, bottom（底部） 或 left（左侧）。