引导4导航栏折叠不起作用(使用JQuery - popper - bootstrap
引导4导航栏折叠不起作用是指在使用JQuery、popper和bootstrap的情况下，导航栏的折叠功能无法正常工作。以下是我对这个问题的完善和全面的答案：
导航栏的折叠功能通常是在移动设备上使用，以便在有限的屏幕空间中提供更好的用户体验。使用JQuery、popper和bootstrap可以方便地实现导航栏的折叠功能。
首先，确保在HTML页面的<head>标签中正确引入了JQuery、popper和bootstrap的相关文件。例如：
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>接下来，在导航栏的HTML代码中添加必要的类名和属性。通常情况下，折叠功能需要用到navbar类和data-toggle属性。例如：
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Logo</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</div>
</nav>在上述代码中，navbar-toggler按钮是用于触发折叠功能的按钮，navbar-collapse类是用于包裹需要折叠的导航栏内容。
最后，确保JQuery、popper和bootstrap的相关文件被正确加载，并且没有其他JavaScript代码或错误阻止了折叠功能的正常工作。
如果你使用腾讯云作为云计算平台，可以参考腾讯云提供的相关文档和产品来实现导航栏的折叠功能，例如：
- 腾讯云云服务器：提供虚拟服务器实例，可用于部署网站和应用。产品介绍链接
- 腾讯云云数据库MySQL版：提供高性能、可扩展的云数据库服务。产品介绍链接
- 腾讯云负载均衡：通过流量分发和会话保持，提高应用的可用性和负载能力。产品介绍链接
请注意，本答案中没有提及其他流行的云计算品牌商，如AWS、Azure等。
相关·内容
2回答
我想创建一个响应式导航栏。但是切换不起作用。我该怎么办？ 我按照引导程序文档中的指定添加了引导程序、jQuery和popper.js链接，并创建了一个导航栏组件。导航栏的样式与未折叠时的样式相同，但折叠后切换不起作用。 import React, { Component } from 'react';
import "jquery/dist/jquery"
import "bootstrap/dist/js/bootstrap";
import 'bootstrap/dist/css/bootstrap';
class
浏览 10提问于2019-05-19得票数 2
回答已采纳
嗯，我不太确定在这一点上，因为这对我来说是毫无意义的。
我正在使用最新版本的Laravel和Laravel，这可能是或可能没有关系。
我更新了Laravel，使其使用最新的具有以下依赖项的Bootstrap 4 Alpha：
"axios": "^0.16.2",
"bootstrap": "^4.0.0-alpha.6",
"cross-env": "^5.0.1",
"jquery": "^3.1.1",
"laravel-mix": "^
浏览 3提问于2017-09-07得票数 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
1回答
我正在尝试添加引导4到角7，我看到样式被引导样式覆盖，但是导航条和下拉框不起作用。
我遵循添加引导到角7项目。我在angular.json中添加了下面的代码
"styles": [
"src/styles.css",
"node_modules/bootstrap/dist/css/bootstrap.min.css"
],
"scripts": [
"node_modules/jquery/dist/jquery.js"
浏览 0提问于2019-04-05得票数 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
这里是JS/Bootstrap和webpack的超级初学者(熟悉超文本标记语言、(S)CSS和PHP，现在尝试RoR ...) 我正在尝试将Bootstrap-5连接到Rails-6。我已经读了至少10篇博客文章和许多A&A在这里，但仍然没有运气。我想创建一个超级简单的导航栏-或多或少直接从Bootstrap模板复制，但下拉菜单和折叠菜单不起作用。我手动将引导程序脚本与其CDN中的<script>标记链接起来-这确实起到了作用，但当然不应该是解决方案。那么，我忽略了什么让引导脚本在Rails6上工作的愚蠢事情呢？特别是，我正在研究this post here -但仍然没有
浏览 22提问于2021-04-08得票数 1
我将使用Bootstrap提供的折叠功能。因此，我安装了jQuery和popper.js：
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"node_modules/hover.css/css/hover.css",
"node_modules/hamburgers/_sass/hamburgers/hamburgers.scss",
"src/styles.scss"
],
"scr
浏览 0提问于2019-07-21得票数 3
回答已采纳
1回答
我想要创建多级下拉元使用引导4和角7。
我可以使用引导的官方文档在导航栏中创建简单的下拉列表。
但是当我尝试创建多级下拉时，它是行不通的。
使用上面的链接，我可以找到一个多级下拉的解决方案。
但是它使用某种jQuery代码来正常工作。
是否有任何内置的方法，使多级下拉使用引导？
在引导程序的正式文档中，我没有看到任何与此相关的内容。
我不知道我是否遗漏了代码中的任何脚本或css。
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css"
浏览 3提问于2020-06-04得票数 2
回答已采纳
1回答
在角应用中引导下拉不起作用
、、、、
我有一个角度应用，在其中，我想使用引导肚脐与下拉。所有来自引导的样式都工作得很好，但是脚本没有工作，例如下拉，不切换，或者调整大小，切换菜单按钮，不工作。
我安装了引导程序、jquery和popper.js，并将它们包括在angular.json中，如下所示：
"styles": [
"./node_modules/bootstrap/scss/bootstrap.scss",
"src/styles.scss"
],
"scripts": [
"./node_modules/jquery/dist/j
浏览 6提问于2022-03-16得票数 0
我创建了一个angular 10项目，并向其中添加了bootstrap、jquery和popper js。之后，我从bootstrap文档中添加了一个默认导航栏，用于检查包含的那些依赖项。Bootstrap和Jquery工作正常，但是Popper JS，它负责在导航栏中显示下拉列表，不工作并且不显示输出。
Angular.json中的包
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.css"
浏览 3提问于2021-06-11得票数 2
2回答
我试图添加一些引导元素，需要Popper (工具提示和折叠)，但它不工作。我尝试了一个简单的版本，只使用了来自Bootstrap站点的模板，而且它也不起作用。
引导文档：
小提琴：
这是代码，非常简单的东西。JS脚本应该很好地导入，因为我使用的只是引导站点上的代码，所以我不知道它为什么不能工作。
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min
浏览 0提问于2018-06-18得票数 0
回答已采纳
我试图删除所有的JQuery依赖和使用在我的角度项目，这是由使用引导4，我删除了下拉和所有的data-***用法。但是，一旦我卸载了JQuery和popper.js，我就会在我的web控制台中看到TypeError消息Bootstrap's JavaScript requires jQuery. jQuery must be included before Bootstrap's JavaScript.。我想知道是否还有其他依赖项data-***或引导带下拉或折叠。引导按钮类也取决于JQuery吗？
浏览 2提问于2020-12-19得票数 0
回答已采纳
我想在nuxt.js中使用引导程序，我如何不使用CDN来做到这一点？我想在nuxt.config.js中使用引导文件，但我不能，我也想使用jquery文件和popper.js --我尝试在nuxt.config.js的头数组中包含这些文件，但是它不起作用，而且我还试图在CSS数组中包含bootstrap.min.css，幸运的是它能工作，但是js属性的引导带属性(如下拉、折叠和其他不起作用的东西)，我知道这些属性不能工作的原因，这是因为Jquery和popper.js没有包含，但是我真的怎么能包括它们呢？请帮帮我
浏览 4提问于2020-08-22得票数 3
回答已采纳
1回答
我希望在asp.net应用程序的视图中包含从引导示例页面复制的导航栏。导航栏如下：
<nav class="navbar navbar-expand-md navbar-dark bg-dark">
<a class="navbar-brand" asp-controller="Home" asp-action="Index">Bata</a>
<button class="navbar-toggler" type="button" data-t
浏览 0提问于2020-08-04得票数 1
1回答
角4中的引导4.1
、、、
如何从角度cli正确地安装引导4，以便所有引导组件都能工作？
我使用了以下命令：
npm安装--保存jquery
npm安装--保存popper.js
npm安装--保存引导程序
并在angular-cli.json文件中配置以下内容：
"scripts": [
"../node_modules/jquery/dist/jquery.slim.min.js",
"../node_modules/popper.js/dist/umd/popper.min.js",
"../n
浏览 1提问于2018-04-13得票数 1
3回答
我在一个Angular 4项目中使用Bootstrap 4和Ng-Bootstrap，
我这样链接了我的bootstrap.css -cli.json中的que
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.css",
"styles.css"
],
并将NgbModule导入到我的app.module中，如下所示
import { BrowserModule } from '@angular/platform-browser';
impo
浏览 65提问于2017-11-02得票数 3
回答已采纳
3回答
我正在尝试使用bootstrap 4建立响应导航栏，其中导航栏已经显示切换按钮，如果屏幕的大小减少了某些像素宽度，我可以显示切换按钮，但我无法显示链接项目时，我点击切换按钮我不知道为什么会发生这种情况，我已经尝试了jquery脚本首先是引导链接，弹出脚本，最后是引导脚本，但仍然不显示导航项目点击切换按钮后，有人能帮助我吗？
下面是我在header中添加的代码
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-w
浏览 9提问于2021-03-13得票数 0
1回答
我创建了下拉列表，就像在引导4文档中一样，但是当我单击按钮时，它会产生错误，如下所示。
<div class="btn-group">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Manage Recipe</button>
<div c
浏览 1提问于2018-05-23得票数 0
回答已采纳
1回答
我想包括引导4在我的角7应用程序。我做了npm install bootstrap --save和css样式的工作很好，但当我想使用按钮从引导折叠肚脐，按钮没有反应。我认为这是因为引导在本例中依赖于jquery和popper.js。我试图通过npm install jquery --save和npm install popper.js --save手动地将它们包括进来。但即使在此之后，我也无法在node_modules文件夹中找到这些模块，也不知道如何包含这些依赖项。
我们会非常感谢你的帮助。谢谢。
浏览 1提问于2019-05-05得票数 0
回答已采纳
1回答
虽然使用rails运行引导程序很好，但JS功能对我来说不起作用。例如，我不能折叠导航条，但我可以在浏览器控制台中运行$()。
My /app/javascript/packs/application.js如下所示：
// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant struct
浏览 2提问于2020-05-07得票数 1
我想知道如何在lit-element/lit-html中实现引导导航栏 我已经在lit-element中创建了导航栏组件，但是导航栏下拉和切换不起作用。 我必须将顶部固定的导航栏实现为html中的lit-element组件。请检查代码并卡住。如果有任何替代方案，请提供解决方案。 // component.js
import { LitElement, html } from 'lit-element';
class MyElement extends LitElement {
render(){
return html`
<link rel
浏览 39提问于2019-05-30得票数 0
twitter-bootstrap 'hero‘示例()运行良好。冒着描述显而易见的事实的风险。在小屏幕上，当导航栏菜单被激活时，只有第一级项可见，子项被折叠。当点击具有子项的项时，子项将展开并变为可见。也可以通过再次点击父对象来折叠它们。
我在Joomla站点()上使用引导模板。不幸的是，当导航栏在一个小屏幕上被激活时，它会扩展许多子项。点击父项目不会展开/折叠其子项目。
如何让twitter-bootstrap导航栏子项在小屏幕上折叠/展开？是什么引导程序代码/文件导致了这种行为？
我知道一些css和javascript，但还不足以解决这个问题。
谢谢。
浏览 5提问于2013-04-06得票数 4
我的网站上有一个可折叠的导航栏。它会自动关闭，并且没有理论上实现的平滑效果。这是一个用gulpfile构建的 Jekyll网站，它连接、缩小和丑化HTML、css和Javascript：
除了可折叠的导航栏之外，一切都运行得很好。可折叠导航栏在本地加载到我的电脑时可以正常工作，但在发布时却无法正常工作。
我猜这个问题可能是由HTML/css缩小过程引起的。
这是它在DOM中的外观：
<div class="bg-dark collapse" id="navbarHeader" style="">
<div class=
浏览 0提问于2018-01-29得票数 2
当在我的应用程序中包含RequireJS配置中的引导程序4时，我会收到以下警告：
与源“”一起加载失败。
以下错误：
错误："popper.js“的脚本错误，需要:引导
当与RequireJS/AMD一起使用引导带4时，我无法解决它。
require = {
paths: {
jquery: '/app/assets/vendor/jquery/dist/jquery.min',
popper: '//cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/p
浏览 1提问于2018-12-13得票数 1
回答已采纳
1回答
从教程构建我的第一个Django应用程序，几乎逐字遵循说明，但我的导航栏下拉菜单无论如何都不能工作，因此无法从导航栏注销或更改密码。 我对js非常陌生，但我已经尝试过一些东西： 尝试使用不同的浏览器(不适用于Safari或Chrome) 我看过类似的问题并实现了这些技术，但它仍然不起作用(在头部链接到js，确保以正确的顺序链接到js/popper/bootstrap，等等)： django bootstrap dropdown not working 我还尝试在pages/ static /js和pages/static/css中创建静态文件夹，但这看起来可能比我们这里要做的更高级的样式。
浏览 26提问于2020-04-01得票数 0
我在使用TypeScript的Aurelia应用程序(v0.31.1)中配置Bootstra4beta时遇到了困难。在尝试了几个配置变体之后，我继续获得以下控制台错误：
未明错误:引导下拉请求Popper.js
以下是复制的步骤。首先，安装软件包：
$ npm install --save jquery bootstrap@4.0.0-beta popper.js
接下来，我配置了aurelia.json
"jquery",
{
"name": "popper.js",
"path": ".
浏览 14提问于2017-08-22得票数 15
回答已采纳
我有一个响应式的网站，在移动设备中导航栏是粘性顶部，而在桌面上它不是粘性顶部。根据移动设备的高度，部分内容会隐藏在导航栏后面。我需要的内容要显示，而不是隐藏在导航栏后面。为此，我尝试通过计算高度margin-top: calc(100vh - 215px); (我的导航栏的高度为215px)来对内容应用margin-top。然而，这并不起作用。当我添加该margin-top时，内容会向下移动，这没有任何意义。(我正在使用Bootstrap 4)。
@media (max-width: 768px) {
body {
background-color: grey;
浏览 0提问于2020-11-16得票数 2
2回答
我正在尝试从Bootstrap 4迁移到Bootstrap 5。当我这样做时，下拉菜单、弹出器和工具提示都不起作用。我和webpack一起使用bootstrap。
Bootstrap 5样式工作正常。
包括由webpack饰演的popper
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery',
Popper: ['popper.js', 'default&
浏览 7提问于2021-06-03得票数 1
最近，我决定尝试新的引导版本(4)。我对文件做了所有正确的处理(下面是我的html )
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" co
浏览 0提问于2017-09-24得票数 6
1回答
使用电子与引导带5不工作
、、、、
我正在创建我的第一个电子应用程序，并且想要一些引导5的样式。所以我：
(1)通过npm i安装--保存引导jquery popper.js所需的模块
(2)创建了一个包含@import /scss/bootstrap的main.scss；
(3)把我的index.html放在头上：
<link rel="stylesheet" href="./contents/bootstrap/5.0.2/css/bootstrap.min.css" />
<script>let $ = require('jquery')
浏览 3提问于2021-07-28得票数 1
1回答
角5+ Popper.JS
、、、、
我正在尝试启动一个需要Popper.Js特性的培训项目。然而，它似乎不允许我仅仅开始使用Popper.Js。
根据Bootstrap的文档，我开始使用Popper.Js
$(function () {
$('[data-toggle="tooltip"]').tooltip();
});
我在ngOnInit的主组件中使用它。但是，它不起作用。此错误发生在“JQuery”类型上不存在“属性‘工具提示’”。我导入了jquery和引导包文件。安装了所有库的类型。
我也尝试了纯"popper.js“而不是bootstrap.bundle.js。但同样的错误
浏览 5提问于2017-12-30得票数 6
回答已采纳
1回答
我有一个angular 11.2.4应用程序，其中我必须使用bootstrap (4.6.0)和基于JQuery的主题。为了在移动视图中显示导航栏，有一个使用navbar-collapse的代码。
<nav class="main-menu navbar-expand-md navbar-light">
<div class="navbar-header">
<!-- Toggle Button -->
</div>
<div class="collapse navbar-c
浏览 15提问于2021-05-18得票数 0
回答已采纳
2回答
我有一个引导导航栏，它在md断点处展开，由两个子菜单组成，它们的折叠是由两个带有navbar-toggler类的按钮控制的。我想让我的导航栏在md扩展，但我的一个子菜单(帐户)始终处于切换状态(在导航栏下触发内容显示的按钮)。
我没有尝试过js，但我猜可以通过脚本来实现。我还在源代码中看到，当导航栏展开navbar-toggler时，会显示:none，这是一个问题。
这是我的导航栏和一个js脚本，用于控制两个子菜单的折叠：
$('#links').on('show.bs.collapse', function() {
$('#accou
浏览 0提问于2019-07-23得票数 0
我有一个全新的ASP.Net MVC5应用程序。我想将默认主题更改为主题，这是Bootstrap Version 4的主题。但是，在遵循以下步骤之后，主题已经混乱，并且没有正确地显示组件，比如Nav。任何人都可以指导我如何从. 安装最新主题
因为它是一个全新的ASP.Net MVC应用程序。我做了以下工作：
已安装引导带：Install-Package bootstrap - Version 4.0.0
已安装的jQuery：Install-Package jQuery -Version 3.2.1
已安装的Popper.js：Install-Package popper.js -
浏览 0提问于2018-01-20得票数 8
回答已采纳
我的Vue JS应用程序引导导航条不能在移动环境中工作。我已经安装了Bootstrap、JQuery和popper节点模块。我的Vue JS应用程序显示错误的模块没有找到。无法解决'node_modules/bootstrap/dist/js/bootstrap'
这是我App.vue上的代码
<style lang="scss">
$primary: #05b2dd;
@import "node_modules/bootstrap/scss/bootstrap";
</style>
<script>
imp
浏览 1提问于2019-12-18得票数 0
使用Bootstrap 4，我如何使固定顶部的导航栏在滚动中消失？我在下面附加了默认Bootstrap 4导航栏的html代码。
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
<a class="navbar-b
浏览 1提问于2019-01-13得票数 3
回答已采纳
1回答
在移动设备上，在默认情况下，Bootstrap 3将导航条(navbar)缩小为汉堡包图标。当单击汉堡包时，JavaScript会切换导航菜单项的显示--扩展或折叠导航条。但
如何在不需要JavaScript的情况下切换引导移动导航条的折叠/展开？
如果这是可能的话，它将有很好的性能优势--：用户可以在执行JavaScript之前导航(这对于片状移动连接来说是一个很好的优点)，而较小的项目可能能够完全放弃对jQuery +引导javascript的依赖，在第一个页面加载时节省大约45k。此外，在JS错误的情况下，站点变得更加健壮，--至少页面导航仍然可以使用。
或者，我们可以为导航栏做 - d
浏览 3提问于2015-07-19得票数 10
回答已采纳
我正在尝试制作一个全宽的下拉列表，看起来像一个折叠项目--网站现在经常使用的全宽可折叠导航。但我想不出该怎么做。
我尝试将Bootstrap的添加到其中，但不起作用。在导航栏中添加多个.navbar- class类是安全的吗？
或者我的方法应该只是编辑Bootstrap的下拉列表？如果是这样，我应该怎么做呢？
下面这张图片向你展示了我正在努力实现的目标：
这是我的代码大纲，请查看全宽截图：
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/
浏览 6提问于2018-04-05得票数 12
回答已采纳
我正在使用角6和sass引导项目，并试图在angular.json中添加jquery、popper和js。
我在angular.json中的代码是：
"styles": [
"src/styles.scss"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/popper.js/dist/popper.min.js",
浏览 0提问于2018-09-27得票数 0
回答已采纳
当我之前包含bootstrap.min.js时，我的引导转盘和导航栏中的下拉菜单似乎不起作用
以下是我的代码
<link href="bootstrap/dist/css/bootstrap.css" rel="stylesheet" type="text/css">
<script src="bootstrap/dist/js/bootstrap.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/j
浏览 4提问于2017-07-14得票数 0
我想要创建一个导航栏，在引导4中注册登录按钮。请检查我正在寻找的图像，确切地说：
请检查我正在做的代码：
navigation.php
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
<
浏览 2提问于2018-11-16得票数 3
回答已采纳
2回答
引导响应导航按钮不工作
、、、、
我尝试过无数的线程，但当将引导导航菜单转换为用于移动/平板电脑的word按下主题时，无法让它下拉。
我的导航代码是
<nav class="navbar navbar-expand-md navbar-dark bg fixed-top logo">
<a class="navbar-brand" href="index.html"><img src="<?php bloginfo(template_directory); ?>/resources/images/Logo-blue-
浏览 0提问于2018-05-03得票数 1
回答已采纳
当屏幕对于导航栏来说太小时，单击3个栏时，我的引导导航栏不会折叠。
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navba
浏览 0提问于2015-06-28得票数 0
我正在尝试将Bootstraps js导入到我的项目主入口点，但我遇到了一些困难。我确信我有所有必需的依赖项(jquery和popper.js)，当我检查我的捆绑文件时，它看起来像是导入了js，但是Bootstrap折叠不起作用。 以下是我在package.json中的应用程序依赖项 "dependencies": {
"bootstrap": "^5.1.3",
"headroom.js": "^0.12.0",
"jquery": "^3.6.0",
浏览 21提问于2021-10-17得票数 0
我在所有的bootstrap中都有这个导航栏：
.navbar {
background-color: aqua;
}
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1
浏览 3提问于2020-02-27得票数 1
我在一个网站上工作，我在设置导航栏时遇到了麻烦。我希望所有导航链接在导航栏展开时居中，而不是在导航栏处于折叠状态时居中。当它处于折叠状态时，我希望它们垂直堆叠并对齐到页面的左侧。我可以成功地让链接在折叠时居中或左对齐，但不能两者兼而有之。 这是我的带有导航栏代码的HTML。在带有类abs-center-x的navbar ul元素中，这是我之前尝试过的方法，如果有帮助，您将在CSS中看到它被注释掉。 <!DOCTYPE html>
<html lang="en">
<head>
<title>Website</t
浏览 29提问于2019-05-21得票数 1
回答已采纳
2回答
我在Bootstrap 4中使用带有品牌徽标图像(150px X 33px)的导航栏。 我需要将导航栏的高度增加到80px。我使用min-height: 80px;来实现这一点。 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewp
浏览 23提问于2019-12-10得票数 2
回答已采纳
我试图通过需求加载jquery、popperjs和引导程序(v4-beta)，并在我一直得到的控制台中加载：
Uncaught Error: Bootstrap dropdown require Popper.js (https://popper.js.org)
at bootstrap.js:6
at bootstrap.js:6
at bootstrap.js:6
以下是我的主要代码：
requirejs.config({
paths: {
'jquery': 'lib/jquery',
'popper&
浏览 9提问于2017-09-01得票数 8
回答已采纳
1回答
向导航栏添加词缀
、、
我目前正在尝试让我的导航栏贴在页面的顶部后，我滚动过去的图像。我尝试了和的解决方案，但是，我似乎不能让导航栏停留在屏幕上。
我的HTML代码是：
<nav class="navbar navbar-expand-sm bg-dark navbar-dark" data-spy="affix"
data-offset-top="50">
我的CSS是：
.affix {
top: 0;
width: 100%;
position: fixed;
}
.affix-top {
width: 100%;
}
我导
浏览 0提问于2018-10-12得票数 0
1回答
好吧..。昨天成功了，明天就不用了.这是真的!
在控制台上，它会显示以下消息：
Error: Bootstrap dropdown require Popper.js (https://popper.js.org)
页面已经加载，但是导航栏看起来并不像它应该做的那样:声音是垂直对齐的，而不是水平对齐的(所以我有很多列)。
我看到bootstrap 4终于发布了..。但我不希望在新版本中通过。
在我的html中，我使用：
<link href='http://getbootstrap.com/dist/css/bootstrap.min.css' rel='styl
浏览 13提问于2017-08-11得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
