Question

使用Bootstrap 3我可以在调整屏幕大小时隐藏两个菜单项，如下面的代码示例所示。问题是，当屏幕调整为较小的尺寸时，这些项目仍将显示在出现的下拉菜单中（左上角，有三个条形）。有没有办法让它们隐藏在那里？

<div class="navbar-collapse collapse">
     <ul class="nav navbar-nav">
         <li> <a id="mobileTab">Start</a></li>
         <li> <a id="mobilityActivityTab" href="#">Tasks</a></li>
         <li class="hidden-sm"> <a id="activityTab">Activity</a></li>
         <li class="hidden-sm"> <a id="clientAcctTab">Accounts</a></li>
     </ul>
     @Html.Partial("_LoginPartial")
</div>

注意：为简单起见，我删除了一些代码。

Answer 1

如果要在移动设备上展开时隐藏项目，请添加课程stateSaveParams: function (settings, data) {} stateLoadParams: function (settings, data) {}（例如隐藏在额外的小部分）

hidden-xs

仅供参考，有一些方便的示例，您可以使用哪些类来显示/隐藏Bootstrap网站上不同设备的不同内容@ http://getbootstrap.com/css/#responsive-utilities

Answer 2

在所有hidden-xs

之前添加hidden-sm

隐藏小屏幕中的菜单项和下拉菜单Bootstrap 3

2 个答案: