我正在嘗試創(chuàng)建一個(gè)帶有頂部和底部的側(cè)面導(dǎo)航。當(dāng)窗口高度縮小時(shí)，我希望底部導(dǎo)航與頂部重疊并且頂部導(dǎo)航具有滾動(dòng)功能。我添加了一些 CSS 漸變來幫助向用戶指示項(xiàng)目已溢出，但我想要一個(gè)滾動(dòng)條。我只想要內(nèi)容溢出時(shí)的滾動(dòng)條（可能需要 JS，但我可能是錯(cuò)的）。感謝幫助在這里搗鼓，下面是 HTML 和 CSS。<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/js/all.min.js"></script><div class="pane-sidebar full-height">  <div class="sidebar-menu-wrapper">    <h1 class="brand">Brand</h1>    <ul class="primary">      <li>        <a href="#">          <i class="far fa-sticky-note"></i>          <span>Top</span>        </a>      </li>      <li class="secondary">        <a href="#">          <i class="far fa-sticky-note"></i>          <span>Top</span>        </a>      </li>      <li class="secondary">        <a href="#">          <i class="far fa-sticky-note"></i>          <span>Top</span>        </a>      </li>      <li class="secondary">        <a href="#">          <i class="far fa-sticky-note"></i>          <span>Top</span>        </a>      </li>      <li class="secondary">        <a href="#">          <i class="far fa-sticky-note"></i>          <span>Top</span>        </a>      </li>      <li class="secondary">        <a href="#">          <i class="far fa-sticky-note"></i>          <span>Top</span>        </a>      </li>      <li class="secondary">        <a href="#">          <i class="far fa-sticky-note"></i>          <span>Top</span>        </a>      </li>    </ul>    <ul class="secondary">      <li class="secondary">        <button class="show-errors" type="button">          <i class="far fa-bell"></i>        </span>      </button>    </li>    <li class="secondary">      <a href="#">        <i class="fas fa-box"></i>        <span>Bottom</span>      </a>    </li>  </ul></div>