Html 在小屏幕和下拉菜单引导3中隐藏菜单项

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

<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>

活动
帐户

@Html.Partial（“_LoginPartial”）

---

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

如果您想在手机上折叠时隐藏项目，请添加类

隐藏的xs

（例如，隐藏在超小屏幕上）

<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-xs hidden-sm"> <a id="activityTab">Activity</a></li>
         <li class="hidden-xs hidden-sm"> <a id="clientAcctTab">Accounts</a></li>
     </ul>
     @Html.Partial("_LoginPartial")
</div>