ul List元素将具有奇怪的理由,即使没有任何修改的理由

时间:2019-06-16 01:08:22

标签: html bootstrap-4

所以在我上的课程中没有其他人遇到这个问题。

如您所见,我正在使用

Chrome 74.0.3729.169桌面Windows Firefox 67.0.1桌面Windows

html:

<html>

<head>

  <!-- Latest compiled and minified CSS -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">

  <!-- jQuery library -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/4.3.1/jquery.min.js"></script>

  <!-- Latest compiled JavaScript -->
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>

<body>





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

    <a class="navbar-brand" href="">DrinDrin</a>

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



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

      <!-- ml-auto tells ul to move over,make space for left element -->
      <ul class="navbar-nav ml-auto">
        <li class="nav-item">
          <a class="nav-link" href="">Projects</anchor>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="">Foods</anchor>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="">Link</anchor>
        </li>
      </ul>

    </div>
  </nav>




  <!-- <button class="btn btn-dark">THBUTTON</button>
  <button class="btn btn-outline-dark">THBUTTON</button>
  <button class="btn btn-large btn-outline-dark">THBUTTON</button>
  <button class="btn btn-primary">THBUTTON</button> -->
</body>

</html>

1 个答案:

答案 0 :(得分:1)

您的结束标记需要与您的开始标记匹配。所以

<a href="">Words Here</anchor> needs to be <a href="">Words Here</a>.

不相关的说明是,没有加载jQuery版本。尝试使用https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js代替https://ajax.googleapis.com/ajax/libs/jquery/4.3.1/jquery.min.js