无法使用 bootstrap 查看第一个下拉子菜单，总是第二个:-(

Question

<div class="btn-group"> 

                <button type="button" class="btn btn-light dropdown-toggle" data-toggle="dropdown">menu1</button>
                <ul class="dropdown-menu">
                    <li><a href="#">a</a></li>
                    <li><a href="#">b</a></li>
                    <li><a href="#">c</a></li>
                    <li><a href="#">d</a></li>
                    <li><a href="#">e</a></li>                 
                </ul>



                <button type="button" class="btn btn-blue dropdown-toggle" data-toggle="dropdown">menu2</button>
                <ul class="dropdown-menu">
                    <li><a href="#">1</a></li>
                    <li><a href="#">2</a></li>                   
                    <li><a href="#">3</a></li>                   
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
              </ul>     

        </div>

Answer 1

您需要将每个 drop-down 包装在单独的 div 中。下面是工作片段

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<div class="btn-group">
  <button type="button" class="btn btn-dark dropdown-toggle" data-toggle="dropdown">menu1</button>
  <ul class="dropdown-menu">
    <li><a href="#">a</a></li>
    <li><a href="#">b</a></li>
    <li><a href="#">c</a></li>
    <li><a href="#">d</a></li>
    <li><a href="#">e</a></li>
  </ul>
</div>
<div class="btn-group">
  <button type="button" class="btn btn-light dropdown-toggle" data-toggle="dropdown">menu2</button>
  <ul class="dropdown-menu">
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
  </ul>
</div>

无法使用 bootstrap 查看第一个下拉子菜单，总是第二个:-(

can't view the first dropdown sub menu with bootstrap, always the second :-(

css

submenu

twitter-bootstrap

drop-down-menu