使用Bootstrap

Question

我正在使用Twitter Bootstrap.css。

我有一个顶部导航栏，通常会显示一个菜单，其中包含子项目的悬停弹出窗口。

但是当由于@media约束而设置折叠时，我想将内容显示为嵌套的<select>和<Option>元素。

单击菜单按钮将显示如下内容：

我不确定如何进行反向崩溃。我尝试过折叠，折叠等等风格。

我想在折叠时显示一个内容，如果没有折叠则显示另一个内容。两个内容区域都需要显示在导航栏区域中。

我想在没有javascript的情况下做纯CSS。

以下是我要在快照时隐藏的HTML。我还没有使用select / option标签创建HTML。

        <div class="collapse navbar-collapse">
    <ul class="nav navbar-nav" ng-if="userData.isAdminUser" style="cursor: pointer;">
        <li class="dropdown">
            <a>Managment</a>
            <ul class="dropdown-menu">
                <li><a href="#/users/">Employees</a></li>
                <li><a href="#/groups/">Groups</a></li>
                <li><a href="#/products/">Products</a></li>
                <li><a href="#/skills/">Skills</a></li>
                <li><a href="#/levels/">Levels</a></li>
            </ul>
        </li>
    </ul>
</div>