css - Bootstrap 3 Navbar 不会在自定义断点处折叠

Question

我用 this 定制了 Bootstrap 配置。我设置了

"@grid-float-breakpoint": "810px",
"@grid-float-breakpoint-max": "800px"

然而，导航栏似乎并没有在 800 像素或接近 800 像素的任何地方折叠。导航栏在大约 600-650 像素处折叠。我究竟做错了什么。我还必须更改任何其他值吗？

导航栏

<nav id="navbar" class="navbar navbar-default navbar-fixed-top" role="navigation" data-selected="#new-li">
<div class="container">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
            <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar">
            </span>
        </button>
        <a class="navbar-brand" href="#"><img src="/C5.WebApp/Content/logo.png" alt="logo"></a>
    </div>
    <div class="navbar-collapse collapse navbar-responsive-collapse">
        <ul class="nav navbar-nav navbar-right">
            <li id="inbox-li"><a href="/C5.WebApp/">Posteingang</a></li>
            <li id="tasks-li"><a href="/C5.WebApp/Tasks">Aufgaben</a></li>
            <li id="calendar-li"><a href="/C5.WebApp/Calendar">Kalender</a></li>
            <li id="contacts-li"><a href="/C5.WebApp/Contacts">Kontakte</a></li>
            <li class="active" id="new-li"><a href="/C5.WebApp/Activity/Create">Neue Aktivität</a></li>
            <li><a href="/C5.WebApp/Login/Logout">Abmelden</a></li>
        </ul>
    </div>
</div>

Answer 1

检查您的 bootstrap.css 文件(非缩小版)，从第 3911 行开始您应该看到以下代码...确保 min-width: 810px是正确的。

@media (min-width: 810px)
  .navbar-toggle {
    display: none;
  }
}

如果这是正确的，那么您可能有一些自定义 CSS 覆盖了断点，或者您没有在 HTML 文件中链接正确的 CSS 文件。