Bootstrap 3导航栏中的许多项目没有折叠，而是生成了两行
Bootstrap是一个流行的前端开发框架，它提供了丰富的组件和样式，可以帮助开发人员快速构建响应式网页。在Bootstrap 3中，导航栏是一个常用的组件，用于在网页顶部或侧边显示网站的导航链接。
在Bootstrap 3的导航栏中，如果项目过多，可能会导致导航栏溢出，无法完全显示在一行中。为了解决这个问题，Bootstrap提供了折叠功能，即当导航栏项目过多时，会自动折叠成一个下拉菜单，以节省空间。
然而，有时候在使用Bootstrap 3导航栏时，可能会遇到一些项目没有折叠，而是生成了两行的情况。这通常是由于以下原因导致的：
- 导航栏样式设置不正确：在Bootstrap中，导航栏的样式需要正确设置，包括容器的宽度、项目的浮动方式等。如果样式设置不正确，可能会导致项目无法折叠而生成两行。
- 项目内容过长：如果导航栏中的项目内容过长，超出了容器的宽度限制，也会导致项目无法折叠而生成两行。这时可以考虑缩短项目的显示文本，或者使用Tooltip等方式显示完整内容。
- 自定义样式冲突：如果在导航栏中使用了自定义的样式或脚本，可能会与Bootstrap的默认样式冲突，导致项目无法正确折叠。此时可以检查自定义样式和脚本，确保它们与Bootstrap的样式兼容。
针对这个问题，可以尝试以下解决方法：
- 检查导航栏的样式设置，确保容器的宽度和项目的浮动方式正确设置。
- 检查导航栏中的项目内容长度，如果过长可以考虑缩短显示文本或使用Tooltip等方式显示完整内容。
- 检查是否存在自定义样式或脚本与Bootstrap的默认样式冲突，如果有，可以尝试调整或移除冲突的样式或脚本。
如果以上方法无法解决问题，可以参考Bootstrap官方文档或社区中的相关讨论，寻找更详细的解决方案。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云原生应用引擎 TKE：https://cloud.tencent.com/product/tke
- 云存储 COS：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务：https://cloud.tencent.com/product/tbaas
- 腾讯云物联网平台：https://cloud.tencent.com/product/iotexplorer
- 腾讯云移动开发：https://cloud.tencent.com/product/mobdev
- 腾讯云音视频处理：https://cloud.tencent.com/product/mps
- 腾讯云人工智能：https://cloud.tencent.com/product/ai
相关·内容
我将react与bootstrap一起使用(不是react-bootstrap)，并在导航栏上工作。
一定宽度(<768px)的导航栏变成了一个移动导航栏，其中包含折叠视图中的链接，你可能已经知道了。
有没有办法找出它是否在移动视图中？我有一个搜索按钮，我希望onclick事件在每个视图中是不同的。
浏览 3提问于2016-07-15得票数 1
twitter-bootstrap 'hero‘示例()运行良好。冒着描述显而易见的事实的风险。在小屏幕上，当导航栏菜单被激活时，只有第一级项可见，子项被折叠。当点击具有子项的项时，子项将展开并变为可见。也可以通过再次点击父对象来折叠它们。
我在Joomla站点()上使用引导模板。不幸的是，当导航栏在一个小屏幕上被激活时，它会扩展许多子项。点击父项目不会展开/折叠其子项目。
如何让twitter-bootstrap导航栏子项在小屏幕上折叠/展开？是什么引导程序代码/文件导致了这种行为？
我知道一些css和javascript，但还不足以解决这个问题。
谢谢。
浏览 5提问于2013-04-06得票数 4
我尝试在bootstrap中创建一个粘性页脚，并使用这里提供的默认模板：
提供的示例似乎有一个问题；当通过较小的分辨率查看页面时，导航栏会折叠(这是理所应当的)，但是最初使内容不会隐藏在导航栏下的60px填充在导航栏和内容之间造成了很大的差距。
有什么想法吗？
谢谢
浏览 0提问于2013-05-29得票数 0
回答已采纳
试图让我的导航栏保持在ipad大小。我使用了这里的代码：
但是当我应用上面的代码时，导航栏消失了(我的max-width为1200px)。代码的底部有这一部分，这将防止导航栏在Bootstrap 3中消失：
.navbar-collapse.collapse.in {
display: block!important;
}
然而，这段代码不适用于我。因此，我尝试在代码的第一部分添加collapse.in，其中.navbar-collapse.collapse是(第12行)。
导航栏现在出现，但未处于折叠状态，并在列表中显示导航栏项目，就像单击折叠的导航栏时一样。如何
浏览 2提问于2017-01-22得票数 0
我想用bootstarp制作可折叠的导航栏。我使用npm下载了bootstrap。
如何包含Bootstrap JS文件以使导航栏可折叠？
浏览 0提问于2019-10-01得票数 0
我在Rails 3.1.2项目中使用Twitter 2.0.1，该项目是用引导-sass实现的。我正在同时加载bootstrap.css和bootstrap-responsive.css文件，以及bootstrap-collapse.js Javascript。
我有一个类似于的导航条的流体布局。这遵循导航栏“响应变化”指令。它工作得很好:如果页面比大约940 to窄，那么导航条就会折叠并显示一个“按钮”，我可以点击这个按钮来展开。
不过，我的肚脐看起来很好，大约550 to宽，也就是说，除非屏幕非常窄，否则它不需要折叠。
如果屏幕宽度小于550 is，我如何告诉Bootstrap只折叠导航条
浏览 16提问于2012-02-23得票数 94
回答已采纳
我正在尝试让Bootstrap 4导航栏只部分折叠。
基本上，我希望一些对齐到右边的项目始终可见，而如果你试图在移动设备上打开网站，左边的大多数导航栏项目都会折叠成菜单。
问题是，当您展开该菜单时，折叠的元素显示在固定菜单之前，正如您所期望的那样，但出于明显的美学原因，我希望它们显示在下面。
工作示例：
扩展时期望的结果：
访问折叠项目时所需的结果：
我一直在尝试元素的配置以及尝试float-right和float-right，但它被证明是无效的，如果不对为我奠定的基础Bootstrap进行重大改变，我不确定如何继续进行。有什么想法吗？
浏览 23提问于2018-08-11得票数 0
回答已采纳
愚蠢的问题:使用Bootstrap v4.0。我们怎样才能把“汉堡包”放在右边，而不是左边？基本上，我想要的是，相反的方向
另一个例子:我需要的东西就在‘汉堡包’下面，而不是在左边：
我看了，，
每个人都会在常规导航栏中谈论项目。但是，折叠导航栏中的项目又如何呢？
*使用Bootstrap 3一切工作正常，我只是找不到如何使用Bootstrap v4.0。
谢谢!
浏览 0提问于2017-11-11得票数 8
回答已采纳
这个问题可以在所有(据我所知的) Twitter Bootstrap版本中表现出来。所以，我有一个导航栏，当屏幕变小时，它就变成了一个可折叠的托盘。这种行为可以在bootstrap演示站点上看到。我还有一些子菜单，在最初的导航栏展开时显示为折叠的。问题是，在第一次折叠时，可折叠对象会得到一个显式的高度设置。如果关闭并再次展开，可折叠对象将获得一个height:auto;
因此，当我单击子菜单项时，下拉菜单被展开，但由于高度被显式设置而溢出。
我尝试的解决方案是添加：
$(function() {
$('.nav-collapse').on({
shown: func
浏览 0提问于2013-02-07得票数 7
回答已采纳
这是一个遵循twitter bootstrap表单的导航栏-它将删除元素，并最终将它们替换为移动方便的可折叠按钮。
但当它进入移动/折叠视图时-导航项目排列非常粗糙-指定组织结构(浮动、边距、宽度等)的最佳方式是什么？这只适用于折叠视图。(例如，链接about和contact可以放入一行，而不是3行)。
浏览 0提问于2014-05-25得票数 1
1回答
我希望我折叠的导航栏在2列中显示。我使用bootstrap 4。
完整大小的导航栏如下所示：
而折叠的导航栏如下所示：
有没有人知道一个简单的方法来使折叠的导航栏有2列，这样每个列表项都会显示出来？所以左边是5号，右边是5号。
非常感谢您的帮助。
浏览 2提问于2018-09-26得票数 1
1回答
我正在使用Bootstrap 3.0来显示一个带有一些链接和搜索字段的导航栏。当我转到“手机版”时，我有一个按钮可以折叠导航栏，并显示所有内容:链接和搜索栏。现在我需要两个按钮，一个按钮只折叠导航栏的链接，另一个按钮只折叠搜索字段。我该怎么做呢？
浏览 1提问于2013-09-16得票数 14
回答已采纳
我在一个页面上有几个响应式导航栏，但当我点击导航栏下拉的小图标时，屏幕上所有的导航栏都会折叠。当我只想要1个导航栏时，如何防止所有导航栏都折叠？
浏览 3提问于2012-10-01得票数 0
回答已采纳
我正在使用knockout和Sammy为我的路由和导航构建SPA。我在使用MVVM模型时尽量保持清晰，因为我希望所有操作都绑定到我的VM中。
我正在尝试弄清楚如何在该模式中使用Bootstrap响应导航栏。我知道如何让Bootstrap nav使用切换按钮和导航栏-折叠，但我觉得为了对称，我应该在我的VM中这样做。
唯一的问题是，我不确定如何根据bootstrap使用的媒体查询进行数据绑定，以切换导航栏切换按钮和导航的折叠部分。
我试图跨越Knockout/Bootstrap流是不是很愚蠢？有没有一种干净的方法可以通过基因敲除绑定来连接Bootstrap生态系统？
谢谢
Tal
浏览 0提问于2014-09-29得票数 0
1回答
在bootstrap中，我想让两个导航栏位于彼此的下方。我的想法是：
导航栏1有一个品牌:主菜单。
导航栏2(在navbar1下面)有一个名为: sub menu的品牌。
当用户在他的移动电话上查看网站时，他/她看到两个可折叠的导航栏。用户现在可以选择要打开的导航栏。菜单或子菜单。
我只是复制了bootstrap网站上的标准代码：
奇怪的是。当我把浏览器变小的时候。此时会出现两个折叠的导航栏。“主菜单”和“子菜单”。当我点击main menu后面的按钮时，会出现主菜单。就像它应该的那样。但当我按下子菜单(取消折叠)按钮时。主菜单再次打开。不是子菜单。
我只是在链接中使用了bootstrap网站
浏览 1提问于2013-12-20得票数 20
回答已采纳
1回答
我在我的网站上有一个Bootstrap导航栏，它有一个折叠的菜单，可以切换开/关。我喜欢这样，当用户单击菜单中的一个链接(顺便说一下，这是一个下拉列表)时，该活动链接应该跳到菜单的顶部。通过这种方式，他们可以看到更多的下拉列表。
这是一个常规的Bootstrap导航栏。我希望当我点击"Dropdown“时，将活动链接带到”项目名称“下的顶部。
浏览 2提问于2015-07-23得票数 0
正如标题中所述，当我单击导航栏按钮时，导航栏不会折叠，但会保持打开状态。 之前我遇到了数据切换的问题，你必须在bootstrap 5中进行数据切换，我解决了这个问题。 但是这个问题我也找不到任何答案。 当我在devTools中检查<div class ="collapse navbar-collapse" id="navbar">时，它在单击时更改为<div class ="navbar-collapse collapse show" id="navbar">。当我单击按钮折叠导航栏时，它会显示正在折叠，
浏览 62提问于2021-03-16得票数 1
回答已采纳
4回答
响应式网站在移动设备上缩小到全宽
、、、、
我正在测试Bootstrap响应性导航栏，我有一个网站。当我在桌面上调整浏览器的大小时，一切都很好，包括导航栏，它变成了可折叠的菜单，顶部有一个小图标，我可以点击它来查看更多的菜单按钮。
但当我在手机浏览器上试用(我在chrome和Android上的互联网浏览器上试用)时，我没有看到响应式的设计。我只能看到非常小的桌面版本，比如网站。
谁能指出我做错了什么？
浏览 41提问于2013-10-03得票数 143
回答已采纳
所以bootstrap的响应式网格对我的站点来说看起来很糟糕。当您缩小窗口时，所有内容都会被粉碎在一起，导航栏会折叠成三行(我禁用了响应式折叠导航栏)。
我试着删除bootstrap-responsive.css，但它仍然存在“流畅的实时网格崩溃”的问题。快把我逼疯了。
如何设置导航栏和整个页面的最小宽度？这样所有的东西都不会被推到一起，你必须使用水平滚动条来导航页面。
浏览 1提问于2012-09-01得票数 4
回答已采纳
我刚开始使用Bootstrap，在我的网页上我有一个可折叠的导航栏。问题出在我的手机(Galaxy s6)上，它显示了没有将导航栏折叠到按钮中的列。有没有办法让导航栏在col sm上崩溃？或者，有没有一种方法可以知道设备是否是移动的，并以某种方式显示？
浏览 2提问于2015-08-21得票数 0
我需要一些帮助，试图弄清楚如何使用bootstrap为1-col或移动设备折叠双导航栏设置。理想情况下，我希望两个导航栏都折叠到同一个折叠的统一菜单中。
我一直在复制、粘贴和编辑，试图弄清楚这一点。
浏览 1提问于2017-05-25得票数 0
1回答
我在Bootstrap里有个导航栏。我的网格设置为"md"，所以当我缩小我的sreen时，导航栏项目会消失，并放在一个下拉按钮中。也就是说，它可以正确地折叠。我的导航栏中只剩下品牌和下拉按钮。
但是当我增加文本大小时，比如
.navbar {
font-size: 18px;
}
有一个中间步骤，导航栏项目下的标志(在768px和991px之间)，我不想要这个。如何避免这种情况并使徽标和菜单项在同一行上，直到缺少位置(菜单项在下拉菜单按钮中可用)？
谢谢！
浏览 0提问于2015-09-24得票数 0
9回答
在响应式布局中隐藏元素？
、、、
纵观bootstrap，看起来它们支持折叠小屏幕的菜单栏项目。页面上的其他项目是否也有类似的内容？
例如，我有一个和导航药丸一起漂浮在右边。在小屏幕上，这会导致问题。我想至少把它放在一个类似的点击显示更多的下拉列表中。
这在现有的Bootstrap框架中是可能的吗？
浏览 2提问于2013-01-08得票数 331
2回答
我是一个HTML/CSS的新手，我正在创建一个网页，上面有一个响应性导航栏。我面临的问题是，当navbar被折叠并按下按钮时，navbar-items在打开的导航菜单的左侧对齐。我希望这些项目与菜单上的中心对齐。我在和上搜索了很多，但是我无法找到解决问题的方法。
下面是我正在使用的HTML代码：
<html>
<head>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
浏览 4提问于2016-08-07得票数 3
回答已采纳
1回答
选择折叠时导航的下拉菜单
、、、
当bootstrap为较小的视口折叠时，我不喜欢折叠的3行导航按钮。有没有办法让导航栏折叠到一个选择下拉菜单，同时把它放在页面的其他地方，而不是放在右上角？就像这样：
浏览 2提问于2012-11-30得票数 2
下面我的代码生成了一个可折叠的Bootstrap 5导航栏，它的按钮在右边而不是左边，但是你会注意到，当展开导航栏时，导航项目没有很好的填充/边距，当它们只被展开时，我如何为导航项目编写CSS规则？ <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta na
浏览 17提问于2021-03-29得票数 0
3回答
我想有一个Bootstrap 3导航栏，有两行与导航元素，并与导航栏品牌跨越两行。在SM+屏幕尺寸上，这两行都是可见的。在XS屏幕尺寸上，第二行折叠并显示要打开的图标栏。
SM+
+-------------------------------------------------------------------------------+
| | Nav-A-1 Nav-A-2 |
| SITE LOGO |-----------------------------
浏览 1提问于2016-06-30得票数 16
我正在工作的网站没有使用桌面版的Bootstrap导航栏，而是利用了移动版的响应式导航栏(并隐藏了自定义导航)。导航栏没有实际的链接，甚至在桌面版本中也存在，显示品牌推广和搜索表单。
然而，问题是该网站最终有三种导航类型：
1)自定义导航单元，桌面版使用。2)带有切换按钮的折叠导航栏3)大多数平板电脑上默认的“导航栏中的导航链接”。我想摆脱这个:有太多的链接(不能对网站结构做太多的改变)，它看起来很嘈杂。
有没有可能Bootstrap的导航栏总是崩溃？
浏览 1提问于2013-06-09得票数 1
我正在使用bootstrap 3.0，并在一个移动网站上工作。我想知道如何改变按钮的背景颜色。导航栏-当导航栏折叠时切换。
基本上我想问的是，当导航栏菜单打开时，如何在移动设备上显示“按下”状态？
浏览 5提问于2013-09-21得票数 1
我使用的是twitter-bootstrap-rails gem，默认情况下导航栏是可折叠的，这真的很烦人。那么，我该如何完全移除这个特性呢？
我到底要在bootstrap_and_override.css.less中放入什么才能使它不可折叠？
浏览 1提问于2012-08-26得票数 0
2回答
我正在使用Bootstrap 4网站的导航栏模板，但我有一个关于折叠导航项目的位置问题。最初，切换按钮放置在导航栏和列表项的左侧。
但我希望它们位于页面的右侧，所以我在按钮和导航项上插入了一个float-xs-right类。然后，如果我单击切换按钮，折叠项目将不会正确定位。正如您在屏幕截图上所看到的。
我希望折叠的项目被放置在下方和左侧。
顺便说一句，这是我的代码：
<nav class="navbar navbar-light bg-faded">
<button class="navbar-toggler hidden-lg-up" t
浏览 4提问于2016-10-28得票数 7
回答已采纳
我想在页面中的Jumbotron右侧创建一个可折叠的浮动导航栏。我使用的是Bootstrap 3.0。
我的导航栏会折叠，但站点名称会在导航栏折叠时消失。另外，导航栏固定在我屏幕的顶部，而不是右侧。我做错了什么？谢谢你的帮助。
<section>
<div class="navbar">
<nav class="navbar navbar-inverse" role="navigation">
<a class="navbar-brand" href="
浏览 3提问于2013-10-03得票数 1
因此，使用bootstrap 4，我创建了一个导航栏，当屏幕变得太小时，它会折叠成一个按钮。当导航栏没有折叠时，导航栏会以完美的顺序进行设置。但是，当它确实折叠在按钮后面时，其中一个项目(图标图像)居中，而其余项目位于左侧。如何使图标仅在导航栏折叠时才向左移动(就像其他项目一样)。 我试着在图标图像上做"float-md-left“，但是没有做任何改变。 <!--Navbar-->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark mx-auto">
浏览 9提问于2019-10-01得票数 0
回答已采纳
7回答
我想以早于768px的分辨率折叠我的导航栏，例如992px，我该怎么做呢？谢谢!(我知道我可以在引导页面上自定义它，但我不想用新的bootstrap.css文件重新开始我的项目)
浏览 2提问于2014-01-13得票数 48
对于B3，有大量带有下拉菜单的顶级导航栏的模板。随着屏幕尺寸变小，菜单折叠为3栏按钮，菜单变成折叠菜单。
有没有使用Bootstrap 4做这件事的例子或模板？我找到的响应示例可以折叠菜单，并显示3栏按钮，但菜单不会变成手风琴菜单。也有许多BS4的下拉示例，但不是响应式的。
当屏幕变小时，我是否必须隐藏整个导航栏，并显示具有所有相同选项的手风琴？这似乎比BS3要多得多的工作。
浏览 1提问于2016-04-25得票数 1
您好，我在我的网站上使用了bootstrap来制作一个可折叠的导航栏。当我调整屏幕大小时，导航栏就会折叠。但是，当我单击可折叠按钮时，导航栏不会出现在下面。
我的代码：
<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
<a class="navbar-brand" href="#">
<img src="images/logo.jpg" alt="Logo" height=&
浏览 1提问于2021-09-18得票数 0
我使用的是bootstrap 4 beta版。
我有一个导航栏，当屏幕全尺寸时，它使用标准大小的按钮作为导航项目，这些按钮显示在导航栏的右侧，与站点徽标一起显示，站点徽标位于导航栏的左侧。
我希望这些按钮跨越宽度的导航栏下拉菜单时，屏幕很小，汉堡菜单是切换。
目前，这些都是左对齐，如下图所示。
我认为使用块级按钮会在下拉菜单上给我想要的结果，但它们在全尺寸导航栏上不起作用。
我的问题是，当切换汉堡菜单时，如何使第二张图片中的按钮跨越下拉菜单的宽度，但当屏幕较大且没有像第一张图片那样折叠到汉堡菜单时，如何使按钮显示为正常大小？
浏览 2提问于2017-10-11得票数 0
这是一个新问题，我在上一个中提到了它，只是为了避免再次发布代码。
我不想重新开始，所以我想知道如何让导航栏折叠，但以动画的方式，我有的代码可以工作，但导航栏仍然不会在点击时折叠。这也可以用bootstrap来完成吗？
对于bootstrap动画来说，这是一个全新的体验，我找不到任何包含好的指令或示例的库。任何链接将不胜感激，以及我的标题问题的修复。
提前谢谢。
浏览 8提问于2018-09-01得票数 0
13回答
我正在使用Bootstrap响应式导航栏。当导航栏折叠时，当我打开菜单并单击菜单项时，菜单不会自动关闭，我必须手动关闭。
是否可以在单击其中一个按钮后使菜单自动关闭？
浏览 14提问于2013-01-10得票数 40
回答已采纳
目前正在为一个项目的页面工作，我有我的代码折叠导航栏时，屏幕调整为移动。一切都按它应该的方式运行，我唯一的问题是图标栏的位置。通常情况下，图标栏在折叠时位于页面的右上角，但也可以将其放在左侧。我到处搜索，我可以找到很多关于改变图标图像的信息，导航栏在什么时候折叠，等等，但是没有关于将它移动到屏幕另一边的信息。
这只是一个具有折叠功能的基本导航条代码，但我需要在左边的图标，而不是右边。
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
浏览 0提问于2014-02-14得票数 0
我正在尝试制作一个导航栏与正确的折叠动画时，有移动屏幕大小。 我一直在关注这个教程：https://angularfirebase.com/lessons/bootstrap-4-collapsable-navbar-work-with-angular/#ui-top-nav-component-html，并设法让它工作起来。但是，正如您在示例中看到的，您首先显示了一个块，然后滑动文本。当然，我希望文本和块同时滑动，就像在bootstrap documentation (Bootstrap navbar)中一样--要查看它，你只需缩小窗口并按下导航栏按钮，就可以看到菜单平滑地折叠。 可以通过
浏览 21提问于2019-02-10得票数 0
我一直在使用中提到的角2/ASP.NET核心SPA模板。当使用dotnet new angular时，使用这些技术和Bootstrap 3.3.7生成一个VisualStudio2017项目。我更新了package.json以使用Bootstrap 4.0.0-alpha.6 6，安装了新的包，并重新运行webpack --config webpack.config.vendor.js来生成新的CSS和JS包。
然而，在切换应用程序中的路由时，我在网络选项卡中注意到，路由现在完成了完整的页面刷新，而不是在路由器插座中输出新内容。
引导程序附带JS文件，允许引导插件工作，在默认的模板输出情况下，
浏览 2提问于2017-03-13得票数 0
回答已采纳
2回答
我有一个很长的导航栏用于桌面视图。当我调整浏览器的大小时，肚脐项目刹车线。在引导带折叠之前，它的大小可以达到3行。它看起来很丑。
在JS中，有一种方法可以控制Bootstrap何时会显示出塌陷的纳米棒？
浏览 3提问于2014-06-09得票数 0
回答已采纳
3回答
我正在使用Bootstrap建立一个网站，我不确定解决以下问题的最好方法是什么。
我在导航栏的左边有一个很大的标志，在右边我有六个导航项目。在XS屏幕尺寸下，导航项目正确地折叠到汉堡菜单中，但是在这样做之前，它们会漂浮在徽标下面，这不应该是正确的行为。
演示:尝试调整此网页的大小->
解决Stack Overflow上类似问题的一种解决方案是简单地更改折叠宽度--然而我发现这并不是最优的，因为不同的设备有不同的高度/缩放，所以宽度不是通用的。
解决此问题的最佳实践是什么？谢谢
浏览 1提问于2017-05-01得票数 0
我目前正在使用Bootstrap v3.3.6和jQuery v1.9.1。我有一个应用程序，一旦达到一定的屏幕分辨率，就会折叠一个水平导航栏。我喜欢这个功能是如何工作的，并希望维护当前的屏幕分辨率断点。当肚脐达到一定宽度时，我想做的也是折叠肚脐。该应用程序允许不同的用户具有不同的角色，这些角色可以根据用户的角色从导航栏中添加或删除项。
有没有一种通过CSS根据导航条的宽度折叠导航条的方法？javascript是唯一的选择吗？
浏览 0提问于2016-12-27得票数 0
回答已采纳
2回答
我有一个问题，因为我做了一个导航栏，它是粘性顶部的，它有几个下拉菜单(每个下拉菜单中有许多按钮)。因此，如果设备的高度太小，它会被裁剪，我可以得到更低的按钮。我需要知道如何在导航栏上添加滚动。
现在它是这样工作的(使用bootstrap 4.0)
而在bootstrap 3.3.7中，它更简单，看起来像这样：
只需将窗口高度更改为300px，您就会看到效果。我需要帮助添加滚动到粘性顶部折叠导航栏。
浏览 23提问于2018-02-17得票数 3
回答已采纳
1回答
<nav role="navigation" class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a href="" class="navbar-brand">Online Notes</a>
<butt
浏览 2提问于2018-03-11得票数 0
我在twitter的bootstrap导航栏中应用了一些样式，然后意识到我不想在折叠版本中使用这些样式。我首先寻找一些应用类来区分折叠和未折叠的栏，但我找不到一个。我将尝试使用JS有条件地添加一个类...有没有更好的方法来做这件事？
浏览 2提问于2013-01-22得票数 1
回答已采纳
我正在使用这个代码示例在一个Angular项目中使用Bootstrap 4实现一个可折叠的导航栏。
Bootstrap与Popper和jQuery一起使用npm安装。版本：
angular/core: 8.2.5
angular/cli: 8.3.3
bootstrap: 4.3.1
popper: 1.0.1
popper.js: 1.15.0
jquery: 3.4.1
如下图所示，减小窗口大小将折叠导航栏并显示汉堡按钮。但是，汉堡包按钮什么也不做，控制台中没有记录错误。
下面是我的导航代码：
<nav class="navbar navbar-expan
浏览 1提问于2019-09-07得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
