下拉列表未显示项目

Question

因此，当我单击下拉菜单时，它可以工作。但是下拉菜单中的文字（学生，志愿者）不会显示。我尝试了几种方法使其显示，但仍然没有。我不知道怎么了。任何帮助将不胜感激

 <div class="container">
    <div class="row align-items-center position-relative">


        <div class="site-logo">
          <a href="index.html" class="text-black"><span class="text-primary">Code4All Initiative</a>
        </div>

          <nav class="site-navigation text-center ml-auto" role="navigation">

            <ul class="site-menu main-menu js-clone-nav ml-auto d-none d-lg-block dropdown">
              <li><a href="index.html">Home</a></li>
              <li><a href="About.html">About</a></li>
              <li><a href="impact.html">Impacts</a></li>
              <li><a href="donate.html">Donate</a></li>
              <li><a href="news.html">News</a></li>
              <li><a href="contact.html">Contact</a></li>
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="register.html">Register</a>
                <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                  <a class="dropdown-item" href="#">Student</a>
                  <a class="dropdown-item" href="#">Volunteer</a>
                </div>
              </li>
            </ul>
          </nav>



      <div class="toggle-button d-inline-block d-lg-none"><a href="#" class="site-menu-toggle py-5 js-menu-toggle text-black"><span class="icon-menu h3"></span></a></div>

    </div>
  </div>