<div class="mui-content">
<ul class="mui-table-view mui-grid-view mui-grid-12">
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-home"></span>
<div class="mui-media-body">预定</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-email"></span>
<div class="mui-media-body">团购</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-chatbubble"></span>
<div class="mui-media-body">新品</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-location"></span>
<div class="mui-media-body">团购</div></a></li>
<!--第二行开始-->
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-search"></span>
<div class="mui-media-body">优惠券</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-media-body">会员</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-media-body">会员</div></a></li>
<li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-phone"></span>
<div class="mui-media-body">会员</div></a></li>
<!--第二行结束-->
</ul>
</div>
mui-grid-12 为12时, mui-col-xs-3 *4 即可实现 一行4个,兼容窄屏幕
mui-grid-9 为9时, mui-col-xs-4 *3 即可实现 一行3个,无法兼容窄屏幕
0 个回复