切换时引导导航栏切换器不显示链接？答案

【问题标题】：Bootstrap navbar toggler not displaying links when toggled?切换时引导导航栏切换器不显示链接？
【发布时间】：2019-03-03 22:45:49
【问题描述】：

这是供参考的代码，以及link to the codepen。

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
  <title>Parallax Website</title>
</head>

<body>

  <!--Navbar-->
  <div class="container-fluid">
    <nav class="navbar navbar-expand-md fixed-top navbar-dark">
      <a class="navbar-brand" href="#"><i class="fas fa-user-circle"></i>Business Website Name</a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navi">
				<span class="navbar-toggler-icon"></span>
			</button>
      <div class="collapse navbar-collapse" id="navi">
        <ul class="nav navbar-nav ml-auto">
          <li class="nav-item"><a class="nav-link" href="#">Home</a></li>
          <li class="nav-item"><a class="nav-link" href="#">About Us</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>
  </div>

一切似乎都运行良好，但由于某种原因，当屏幕缩小时，“汉堡包”在单击时不显示任何列表项。

此外，底部有一个非常烦人的小白边，无论我放置多少个 margin:0，我似乎都无法摆脱它。啊。

【问题讨论】：

标签： html bootstrap-4 navbar nav

【解决方案1】：

使用正确版本的 Bootstrap 4 JavaScript（不是 3.x）。 Codepen 使用的是 Bootstrap JS 3.x，因此导航栏切换器不起作用。

要删除页脚的边距，请从段落 (<p>) 中删除底部边距 (mb-0)...

<footer>
    <div class="container-fluid footer">
        <p class="feetText mb-0">
            Copyright 2018 © Payton Jewell
        </p>
    </div>
</footer>

https://www.codeply.com/go/xipKGoGnkU

【讨论】：