Bootstrap 实现 二级 侧边栏

概述

项目需要使用二级的侧边栏。用Bootstrap3实现如下（代码为示意，美化看自己的风格）。

代码

<ul class="nav nav-pills nav-stacked">
        <li role="presentation" class="active">
            <a href="#" data-toggle="collapse" data-target="#details_rtu_param">终端参数</a>
            <ul id="details_rtu_param" class="collapse in">
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
            </ul>
        </li>
        <li role="presentation" class="active">
            <a href="#" data-toggle="collapse" data-target="#details_net_param">网络通道参数</a>
            <ul id="details_net_param" class="collapse in">
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
            </ul>
        </li>
        <li role="presentation" class="active">
            <a href="#" data-toggle="collapse" data-target="#private_line_param">专线通道参数</a>
            <ul id="private_line_param" class="collapse in">
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
            </ul>
        </li>
        <li role="presentation" class="active">
            <a href="#" data-toggle="collapse" data-target="#details_dial_param">拨号通道参数</a>
            <ul id="details_dial_param" class="collapse in">
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
            </ul>
        </li>
        <li role="presentation" class="active">
            <a href="#" data-toggle="collapse" data-target="#details_dial_param_standby">拨号通道参数(备)</a>
            <ul id="details_dial_param_standby" class="collapse in">
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
            </ul>
        </li>
        <li role="presentation" class="active">
            <a href="#" data-toggle="collapse" data-target="#details_meter_param">表计参数</a>
            <ul id="details_meter_param" class="collapse in">
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
                <li>子菜单</li>
            </ul>
        </li>
    </ul>

效果