排版效果
<![CDATA[
<div class="footnav">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
]]>
颜色
<![CDATA[
<div class="footnav footnav-red">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-yellow">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-blue">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-green">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-info">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
]]>
底色
<![CDATA[
<div class="footnav footnav-bg-red">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-bg-yellow">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-bg-blue">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-bg-green">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-bg-info">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
<br>
<div class="footnav footnav-bg-black">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车</a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
]]>
底部浮动
<![CDATA[
<div class="footnav fixed-bottom mwidth">
<a href="" class="active"><i class="ui-icon-home"></i>首页</a>
<a href=""><i class="ui-icon-list"></i>分类</a>
<a href=""><i class="ui-icon-cart"></i>购物车<span class="badge badge-red">80</span></a>
<a href=""><i class="ui-icon-user"></i>我的</a>
</div>
]]>