Question

我有这段代码，我尝试使用bootstrap实现一个下拉栏。我直接从bootstrap网站复制了这段代码但是栏没有打开。知道它可能有什么问题吗？

             <div class="row">
                <div class="col-sm-1">
            <div class="dropdown">
              <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                Dropdown
                <span class="caret"></span>
              </button>
              <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li role="separator" class="divider"></li>
                <li><a href="#">Separated link</a></li>
              </ul>
            </div>
                </div>
                </div>

Answer 1

您的代码看起来没有太大问题，我刚刚进行了空白页面的测试，您的下拉列表似乎正在运行。我建议您查看代码的其余部分是否有任何未封闭的代码。

The Dropdown

Answer 2

我认为问题在于您没有下载Bootstrap 。

您可以从CDN下载引导程序或包含引导程序。如果您只是想让它更容易并从Bootstrap中检索信息而不必下载它，请将此 CDN 放在<head>部分中：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

但请注意这一点！因为这个CDN在没有互联网的情况下无法运行，所以你需要在那个时候下载bootstrap。

如果这不起作用，您可以在此处详细了解bootstraps的基础知识及其工作原理： https://www.w3schools.com/bootstrap/bootstrap_get_started.asp

Bootstrap下拉列表未打开

2 个答案: