导航菜单(底部)


固定样式代码
<!--底部固定-->
<!--
	如果你想让底部元素固定,就为该元素添加 id="javaex-footer"
-->
<div id="javaex-footer" class="footer-ul">
	<ul class="equal-5 clear">
		<!--为li添加active属性,可以高亮-->
		<li class="active"><span class="icon-home"></span><br>首页</li>
		<li><span class="icon-cast"></span><br>板块</li>
		<li><span class="icon-edit-2"></span><br>发帖</li>
		<li><span class="icon-compass"></span><br>发现</li>
		<li><span class="icon-user-o"></span><br>我的</li>
	</ul>
</div>
弹出样式代码
<!--底部固定-->
<!--
	如果你想让底部元素固定,就为该元素添加 id="javaex-footer"
-->
<div id="javaex-footer" class="footer-div">
	<!--grid为框架内置的栅格系统-->
	<div class="grid-1-1-1">
		<div>无弹出</div>
		<!--有弹出菜单时,必须为div加上 class="javaex-menu"-->
		<div class="javaex-menu">
			弹出菜单2
			<!--子菜单-->
			<div class="sub-menu">
				<ul>
					<li><a href="javascript:;">弹出菜单2-1</a></li>
					<li><a href="javascript:;">弹出菜单2-2</a></li>
				</ul>
			</div>
			<!--右下角三角图标-->
			<div class="menu-flag"></div>
		</div>
		<!--有弹出菜单时,必须为div加上 class="javaex-menu"-->
		<div class="javaex-menu">
			弹出菜单3
			<!--子菜单-->
			<div class="sub-menu">
				<ul>
					<li><a href="javascript:;">弹出菜单3-1</a></li>
					<li><a href="javascript:;">弹出菜单3-2</a></li>
					<li><a href="javascript:;">弹出菜单3-3</a></li>
				</ul>
			</div>
			<!--右下角三角图标-->
			<div class="menu-flag"></div>
		</div>
	</div>
</div>
固定样式演示
弹出样式演示