Question

我正在使用我的Bootstrap导航栏，我希望得到submenu的一些帮助，因为我不能克服multi-level submenus。

我有这个架构：

我希望Création Fiches Individuelles (sans n° unique)和Création Fiches Individuelles (avec n° unique)位于Création Fiches Individuelles旁边。

换句话说，我想将最后一个框放在Création Fiches Individuelles旁边，然后单击此子菜单以显示最后一个子菜单。然后我只想显示最后一级，如果我把鼠标放在Création Fiches Individuelles上并不是所有时间。

这是我的HTML文件中的相关部分：

<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown"> <span class="glyphicon glyphicon-file">
                                            </span>  Actes Etat Civil <b class="caret"></b></a>
                                <ul class="dropdown-menu">
                                    <li class="dropdown dropdown-submenu">
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                            <span class="glyphicon glyphicon-user">
                                            </span> Fiches Individuelles 
                                        </a>
                                        <ul class="dropdown-menu sub-menu">
                                            <li><a href="{% url "home" %}">Accueil Fiches Individuelles</a></li>

                                            <li class="dropdown dropdown-submenu">
                                                <li><a href="#"> Création Fiches Individuelles</a></li>
                                                <ul class="dropdown-menu">
                                                    <li><a href="{% url "form" %}">Création Fiches Individuelles (sans n° unique) </a></li>
                                                    <li><a href="{% url "form2" %}">Création Fiches Individuelles (à partir n° unique) </a></li>
                                                </ul>
                                            </li>

                                            <li><a href="{% url "searched" %}">Consultation Fiches Individuelles</a></li>
                                            {% if request.user|has_group:"admin" %}
                                            <li><a href="{% url "edited" %}">Edition Fiches Individuelles</a></li>
                                            <li><a href="{% url "deleted" %}">Suppression Fiches Individuelles</a></li>
                                            {% endif %}
                                        </ul>
                                    </li>
...

为了做到这一点，是否有可能得到一些帮助？

谢谢！

Answer 1

在CSS中，这可能有用。

.dropdown-toggle .dropdown-menu .dropdown-menu .dropdown-menu{
    display:none;
}
.dropdown-toggle .dropdown-menu .dropdown-menu .dropdown > li > a:hover .dropdown-menu{
    display:block;
    position: absolute;
    left:100%;
    top:0;
}

然而，像这样的嵌套类并不理想。在你的HTML中，我会在菜单的每个级别添加分类。。一级 .LEVEL二 .LEVEL三

等

带Bootstrap的下拉子菜单

1 个答案: