AI写作智能体 自主规划任务,支持联网查询和网页读取,多模态高效创作各类分析报告、商业计划、营销方案、教学内容等。 广告
Navbar,顶部 tab,当需要在页面顶部展示 tab 导航时使用,用法与 Tabbar 类似。 ![image](https://cloud.githubusercontent.com/assets/4652816/13284130/41649ffc-db2d-11e5-8872-319be7424b34.png) `.weui-navbar` 通常作为 `.weui-tab` 子元素、`.weui-tab__panel` 的兄弟元素一起使用。结构为: ```html <div class="weui-tab"> <div class="weui-navbar"> <div class="weui-navbar__item weui-bar__item_on"> 选项一 </div> <div class="weui-navbar__item"> 选项二 </div> <div class="weui-navbar__item"> 选项三 </div> </div> <div class="weui-tab__panel"> <div>Page 1</div> <div style="display:none">Page 2</div> <div style="display:none">Page 3</div> </div> </div> ``` `.weui-tab` 作为外层容器,高度撑满它的父容器的高度,`.weui-tab__panel` 作为 tab 的主体内容,占据除了 `.weui-navbar` 以外的全部父容器的高度,`.weui-navbar` 则为底部的导航栏。而 `.weui-navbar__item` 为 `.weui-navbar` 的子元素,表示一个导航区,建议不超过 5 个。 另外,需要给当前激活的 `.weui-navbar__item` 元素添加 `.weui-bar__item_on` 类,来标示当前高亮的条目。