先上图片看下效果：
一、bootstrap.min.css
这个左侧菜单是使用bootstrap实现的，我用的是Bootstrap v3.3.5，请确保已下载相关文件并放在OneThink的目录下：
\Public\static\bootstrap3\css\bootstrap.min.css
并在以下文件中引用bootstrap.min.css样式
\Application\Home\View\default\Public\head.html
引用bootstrap.min.css样式的代码：
<link href="__STATIC__/bootstrap3/css/bootstrap.min.css" rel="stylesheet">二、左侧菜单代码left_mem.html
<div class="col-lg-3 bs-docs-sidebar" style="padding-top:30px;">
<div class="list-group">
<div class="list-group-item active text-center">会员中心</div>
<a href="#" class="list-group-item list-group-item-danger" style="padding-left:80px;">购物车</a>
<a href="#" class="list-group-item list-group-item-danger" style="padding-left:80px;">我的订单</a>
<a href="{:U('Mem/profile')}" class="list-group-item list-group-item-danger" style="padding-left:80px;">修改密码</a>
<a href="{:U('Mem/logout')}" class="list-group-item list-group-item-danger" style="padding-left:80px;">退出</a>
</div>
</div>使用bootstrap做这个左侧菜单很简单，就是引用了.list-group实现，代码如上。三、资源
请见附件
（完）
151016三分钟做出一个漂亮的左侧菜单.rar
( 18.41 KB 下载：126 次 )
最佳答案
