为了账号安全,请及时绑定邮箱和手机立即绑定

Bootstrap 响应式菜单按钮不会响应

Bootstrap 响应式菜单按钮不会响应

慕斯709654 2023-09-11 17:10:30
我制作的这个 Bootstrap 菜单很糟糕,我不明白为什么它不会折叠、动画。一切都很好,但按钮不起作用。        <nav class="navbar navbar-expand-lg navbar-light bg-dark alb">          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">            <span class="navbar-toggler-icon"></span>          </button>      <!-- Logo pentru desktop -->                    <a href="index.html" class="logo">                        <img src="img/logo.png" alt="IMG-LOGO">                    </a>          <div class="collapse navbar-collapse" id="navbarTogglerDemo03">            <ul class="navbar-nav mr-auto mt-2 mt-lg-0">              <li class="nav-item active">                <a class="nav-link" href="#" style="color:white">Home <span class="sr-only">(current)</span></a>              </li>              <li class="nav-item">                <a class="nav-link" href="#" style="color:white">Marci moto</a>              </li>              <li class="nav-item">                <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true" style="color:white">Sectiune dezactivata</a>              </li>            </ul>            <form class="form-inline my-2 my-lg-0">              <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">              <button class="btn btn-outline-success my-2 my-sm-0" type="submit" style="color:white">Cautare</button>            </form>          </div>        </nav>
查看完整描述

1 回答

?
千万里不及你

TA贡献1784条经验 获得超9个赞

我使用了与您相同的代码,并且仅在我的代码中使用在线 CDN,它对于您提供的相同代码运行良好。将你的代码与我的代码进行比较,找出错误所在。


以下是我的代码片段:


<!DOCTYPE html>

<html>

<head>

  <title>Bootstrap Example</title>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

</head>

<body>

  <nav class="navbar navbar-expand-lg navbar-light bg-dark alb">

    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">

      <span class="navbar-toggler-icon"></span>

    </button>

    <a href="index.html" class="logo">

      <img src="img/logo.png" alt="IMG-LOGO">

    </a>


    <div class="collapse navbar-collapse" id="navbarTogglerDemo03">

      <ul class="navbar-nav mr-auto mt-2 mt-lg-0">

        <li class="nav-item active">

          <a class="nav-link" href="#" style="color:white">Home <span class="sr-only">(current)</span></a>

        </li>

        <li class="nav-item">

          <a class="nav-link" href="#" style="color:white">Marci moto</a>

        </li>

        <li class="nav-item">

          <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true" style="color:white">Sectiune dezactivata</a>

        </li>

      </ul>

      <form class="form-inline my-2 my-lg-0">

        <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">

        <button class="btn btn-outline-success my-2 my-sm-0" type="submit" style="color:white">Cautare</button>

      </form>

    </div>

  </nav> 

</body>

</html>

我希望这将帮助您解决您的问题。



查看完整回答
反对 回复 2023-09-11
  • 1 回答
  • 0 关注
  • 68 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信