导航菜单
  • 首页
  • 新闻
  • 图片
  • 视频
  • 视频
  • 视频
  • 视频
  • 视频
  • 视频

横向滚动菜单

横向滚动菜单的父层不能有纵向滚动条,IOS可能直接都不显示,像例子一样放在header里面,就可以固定在顶部. 另外一种是结合 bui-slide tab使用

示例:
<div class="bui-navbar"> <ul class="bui-nav"> <!-- li 不能换行,不然会有间隙,这样就不用计算宽度 --> <li class="bui-btn">首页</li><li class="bui-btn">新闻</li> </ul> </div>

文本导航菜单

示例:
<ul class="bui-nav"> <li class="bui-btn">首页</li> <li class="bui-btn">新闻</li> </ul>

水平图标居左导航菜单

示例:
<ul class="bui-nav"> <li class="bui-btn bui-box"> <i class="icon-home"></i> <div class="span1">首页</div> </li> </ul>

纵向图标导航菜单

示例:
<ul class="bui-nav"> <li class="bui-btn bui-box-vertical"> <i class="icon-home"></i> <div class="span1">首页</div> </li> </ul>

流式纵向图标导航菜单

示例:
<ul class="bui-nav bui-fluid"> <li class="bui-btn bui-box-vertical span6"> <i class="icon-home"></i> <div class="span1">首页</div> </li> <li class="bui-btn bui-box-vertical span6"> <i class="icon-home"></i> <div class="span1">首页</div> </li> </ul>