更改引导导航栏折叠断点而不使用LESS [英] Change bootstrap navbar collapse breakpoint without using LESS

问题描述

目前，当浏览器宽度降至768像素以下时，导航栏将更改为折叠模式。我想将此宽度更改为1000px，因此当浏览器低于1000px时，导航栏更改为折叠模式。我想这样做而不使用LESS，我使用手写笔不是LESS。

Currently when the browser width drops below 768px, the navbar changes to collapsed mode. I want to change this width to 1000px so when the browser is below 1000px the navbar changes to collapsed mode. I want to do this without using LESS, I am using stylus not LESS.

我的问题与此问题相同： Bootstrap 3 Navbar Collapse

My issue is the same as in this question: Bootstrap 3 Navbar Collapse

但是这个问题的所有答案解释了如何通过更改LESS变量来做到这一点。我没有处理LESS，我使用手写笔，所以我想知道如何这可以使用手写笔或另一种方法。

But all the answers in that questions explain how to do it by changing LESS variable. I haven't been dealing with LESS, I am using stylus so I want to know how this can be done using stylus or another method.

谢谢！

推荐答案

您必须针对此问题写下一个特定媒体查询导航栏将折叠，因此将其应用于768像素和以下的1000像素以下：

You have to write a specific media query for this, from your question, below 768px, the navbar will collapse, so apply it above 768px and below 1000px, just like that:

@media (min-width: 768px) and (max-width: 1000px) {
   .collapse {
       display: none !important;
   }
}

这将隐藏导航栏折叠，直到默认出现引导单元。当折叠类翻转时，导航栏内部的内部资产将被自动隐藏，像聪明的你必须根据自己的需要设计css。

This will hide the navbar collapse until the default occurrence of the bootstrap unit. As the collapse class flips the inner assets inside navbar collapse will be automatically hidden, like wise you have to set your css as you desired design.

这篇关于更改引导导航栏折叠断点而不使用LESS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！