aui-bar + aui-bar-tab组合实现,可以实现固定在底部的工具栏,可以结合aui-tab.js来使用
aui-bar-tab-item为子级元素
aui-active选中时样式
<footer class="aui-bar aui-bar-tab" id="footer"> <div class="aui-bar-tab-item aui-active" tapmode> <i class="aui-iconfont aui-icon-home"></i> <div class="aui-bar-tab-label">首页</div> </div> <div class="aui-bar-tab-item" tapmode> <i class="aui-iconfont aui-icon-star"></i> <div class="aui-bar-tab-label">收藏</div> </div> <div class="aui-bar-tab-item" tapmode> <div class="aui-badge">99</div> <i class="aui-iconfont aui-icon-cart"></i> <div class="aui-bar-tab-label">购物车</div> </div> <div class="aui-bar-tab-item" tapmode> <div class="aui-dot"></div> <i class="aui-iconfont aui-icon-my"></i> <div class="aui-bar-tab-label">我的</div> </div> </footer>