Html 使 bootstrap 下拉列表下推内容

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js"></script>
<ul class="accordion accordion-flush list-unstyled" id="accordionFlushExample">
  <li class="accordion-item border-bottom-0">
    <h2 class="accordion-header" id="flush-headingOne">
      <button  type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
        Dropdown 1
      </button>
    </h2>
    <div id="flush-collapseOne" class="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="#accordionFlushExample">

      <ul class="accordion-body list-unstyled">
        <li><a class="dropdown-item" href="#">something 1</a></li>
        <li><a class="dropdown-item" href="#">something 2</a></li>
        <li><a class="dropdown-item" href="#">something 3</a></li>
      </ul>
    </div>
  </li>
  <li class="accordion-item border-bottom-0">
    <h2 class="accordion-header" id="flush-headingTwo">
      <button  type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseTwo" aria-expanded="false" aria-controls="flush-collapseTwo">
        Dropdown 2
      </button>
    </h2>
    <div id="flush-collapseTwo" class="accordion-collapse collapse" aria-labelledby="flush-headingTwo" data-bs-parent="#accordionFlushExample">
      <ul class="accordion-body list-unstyled">
        <li><a class="dropdown-item" href="#">else 1</a></li>
        <li><a class="dropdown-item" href="#">else 2</a></li>
        <li><a class="dropdown-item" href="#">else 3</a></li>
      </ul>
    </div>
  </li>
</ul>