Jquery 将引导3.0导航栏默认调整大小更改为自定义调整大小

我正在尝试建立一个动态的移动网站，根据屏幕大小进行调整

以下是导航栏目前的功能：

在766px宽度下：

768px宽度：

990px宽度：

992px宽度：

我基本上想削减768-990px阶段，因为它看起来不是很好

我检查了元素，在引导默认css中发现了此代码，它显示在768px的屏幕宽度处：

media="screen"
@media (min-width: 768px)
.container>.navbar-header, .container>.navbar-collapse {
    margin-right: 0;
    margin-left: 0;
}

我尝试过将

minwidth

更改为

992px

，但似乎没有任何效果

以下是我的导航栏代码：

        <nav class="navbar navbar-default" role="navigation"> 
            <div class="container">
                <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                    <a class="navbar-brand" href="index.html">Welsh for Adults</a>
                </div>

                <div class="collapse navbar-collapse navbar-ex1-collapse">
                    <ul class="nav navbar-nav">
                        <li class="active"><a href="index.html"><span class="glyphicon glyphicon-home" style="font-size:85%;"></span> Home</a></li>
                        <li><a href="taster.html">Welsh Taster Course</a></li>
                        <li><a href="courses.html">Courses</a></li>
                        <li><a href="activities.html">Informal Learning Activities</a></li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        <li><button type="button" class="btn btn-danger navbar-btn change-lang" data-lang="cym">Cymraeg</button></li>
                    </ul>
                </div>

            </div>
        </nav>

切换导航







辛姆雷格

只需在一个位置覆盖媒体查询，如下所示：

@media (min-width: 768px){
.container {
width: 100% !important;
}

---

只需确保将id应用于nav，并在CSS中使用该id即可。我确信您不希望该行为应用于页面上的所有

.container

。

大约有512行navbar.css。使用更少更容易！所有最小宽度从768变为最小宽度、992px或1000px或其他。您必须在css中的适当位置更改768px的旧css中断

---

没什么区别，试着改变你的JS小提琴的大小-它也一样你确定吗？我的小提琴设法避开了768px和992px之间的状态。根据需要，导航布局不分为两行。你试过只调整小提琴的“结果”框大小吗？对我来说，你的是在JFIDLE的

770px

宽范围内调整的。我也有媒体查询，以改变字体的大小，我有一种感觉，它可能与此有关！我注意到它在引导模板上做了同样的事情（尝试慢慢调整页面大小，布局就会混乱…这一定是bootstrap中的一个错误。它不是一个错误。bootstrap.css上的断点是768px。您可以使用自定义程序全局调整它，也可以全局调整较少的文件，或者您可以创建一个新变量，在需要的地方调整它。有很多地方。我都有bootstrap。）在一个css文件（6805）行中，你是说要从这个文件中删除768px处的旧断点吗？当然是那些与导航栏相关的断点。你可以比较jsbin和你的jsbin，只有那些相关的媒体查询才会改变，否则整个网站都会有问题。做一个备份你不删除，你就改变它们。