Question

我正在尝试为语言选择菜单实现Bootstrap下拉菜单。我以为我遵循的格式是Bootstrap和其他教程，但我只得到一个按钮以及按钮旁边或下方的一系列链接。

首先，我尝试了Bootstrap 4文档。我已经尝试了所有类似的StackOverflow答案和https://www.w3schools.com/bootstrap4/bootstrap_dropdowns.asp上的教程以及一些Youtube视频。无论出于什么原因（我希望有人能启发我），都没有任何效果。

这是我的小提琴的链接，以供参考。 https://jsfiddle.net/rescriba/9a7bmdkf/30/

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown button</button>  
  <div class="dropdown-menu" id="flagDiv" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item" title="English" href="#">EN</a>
    <a class="dropdown-item" title="Deutsch" href="#">DE</a>
    <a class="dropdown-item" title="Française" href="#">FR</a>
    <a class="dropdown-item" title="Italiano" href="#">IT</a>
    <a class="dropdown-item" title="Español" href="#">ES</a>
    <a class="dropdown-item" title="Português" href="#">BR</a>
    <a class="dropdown-item" title="русский" href="#">RU</a>
    <a class="dropdown-item" title="中国" href="#">SCN</a>
    <a class="dropdown-item" title="日本" href="#">JP</a>
    <a class="dropdown-item" title="한국의" href="#">KR</a>
  </div>
</div>

Answer 1

您没有在该JSFiddle中包含引导CSS主题。那是你的问题吗？

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">

不要使用W3 Schools，请参考官方的Bootstrap文档。 https://getbootstrap.com/docs/4.0/getting-started/download/

Bootstrap下拉菜单最终显示为一个按钮和一系列导航项目

1 个答案: