html 中Bootstrap实现可折叠3级侧边导航菜单样式好看点

可以试试以下代码，它实现了可折叠的3级侧边导航菜单，并且使用了Bootstrap样式：

<nav class="navbar navbar-default sidebar" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-sidebar-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>      
        </div>
        <div class="collapse navbar-collapse" id="bs-sidebar-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">Home<span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-home"></span></a></li>          
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Level 1<span class="caret"></span><span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-chevron-down"></span></a>
                    <ul class="dropdown-menu forAnimate" role="menu">
                        <li><a href="#">Level 1.1</a></li>
                        <li class="dropdown-submenu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Level 1.2<span class="caret"></span></a>
                            <ul class="dropdown-menu forAnimate" role="menu">
                                <li><a href="#">Level 1.2.1</a></li>
                                <li><a href="#">Level 1.2.2</a></li>
                                <li class="dropdown-submenu">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Level 1.2.3<span class="caret"></span></a>
                                    <ul class="dropdown-menu forAnimate" role="menu">
                                        <li><a href="#">Level 1.2.3.1</a></li>
                                        <li><a href="#">Level 1.2.3.2</a></li>
                                        <li><a href="#">Level 1.2.3.3</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</nav>

注意，需要引入Bootstrap的相关文件。同时，为了实现折叠效果，需要引入jQuery和Bootstrap的JavaScript文件。