Question

这是我的导航栏代码：

//Custom css

.navbar {
  background-color: transparent;
  background: transparent;
  border-color: transparent;
  margin-bottom: 0;
  padding: 10px;
  font-size: 20px;
  box-shadow: 0px 6px 33px 4px rgba(0,0,0,0.59);
}

.nav-link {
  color:#909095 !important;
}

.nav-link:hover {
  color:#05a58d !important;
}

.navbar-brand, .nav-item {
  padding-left: 60px;
}

    <nav class="navbar navbar-expand-lg navbar-dark bg-white fixed-top navbar-fixed-top">
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <a class="navbar-brand" href="#">
        <img src="img/logo1.png" width="200" height="50" class="d-inline-block align-top" alt="">
      </a>
      <div class="collapse navbar-collapse" id="navbarNavDropdown">
        <ul class="navbar-nav">
          <li class="nav-item">
            <a class="nav-link hvr-underline-from-right" href="#section1"><i class="fas fa-code"></i>Services</a>
          </li>
          <li class="nav-item">
            <a class="nav-link hvr-underline-from-right" href="#section2"><i class="fas fa-pencil-alt"></i>About</a>
          </li>
          <li class="nav-item">
            <a class="nav-link hvr-underline-from-right" href="#"><i class="fas fa-users"></i>Portfolio</a>
          </li>
          <li class="nav-item">
            <a class="nav-link hvr-underline-from-right" href="#"><i class="fas fa-envelope"></i>Bla bla bla</a>
          </li>
        </ul>
      </div>
    </nav>

我正在使用引导程序和jquery。当href位于＃上时，导航项将处于活动状态，但不适用于任何其他链接，例如＃section1。

对不起，我的英语不好，又打乱了<3

Bootstrap导航项在使用scrollspy时未激活

0 个答案: