引导程序中的活动下拉菜单答案

【问题标题】：active dropdown menu in bootstrap引导程序中的活动下拉菜单
【发布时间】：2015-12-12 03:01:05
【问题描述】：

我尝试在引导程序中创建一个下拉菜单，但它不起作用！我在 w3schools 尝试了很多样本，但没有一个有效:(

 <!-- links -->
 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

 <!-- My Code -->
<div class="container">
  <h2>Dropdowns</h2>
  <p>The .dropdown class is used to indicate a dropdown menu.</p>
  <p>Use the .dropdown-menu class to actually build the dropdown menu.</p>
  <p>To open the dropdown menu, use a button or a link with a class of .dropdown-toggle and data-toggle="dropdown".</p>                                          
  <div class="dropdown">
    <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example
    <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a href="#">HTML</a></li>
      <li><a href="#">CSS</a></li>
      <li><a href="#">JavaScript</a></li>
    </ul>
  </div>
</div>

【问题讨论】：

您发布的代码有效，那么“它们都不起作用”究竟是什么意思？
在这里工作 -> codepen.io/anon/pen/wMKaYd。控制台有错误吗？

标签： html css twitter-bootstrap drop-down-menu

【解决方案1】：

尝试完成标记。在这里工作正常。

<html>
    <head>
        <!-- links -->
        <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    </head>
    <body>
        <!-- My Code -->
        <div class="container">
            <h2>Dropdowns</h2>
            <p>The .dropdown class is used to indicate a dropdown menu.</p>
            <p>Use the .dropdown-menu class to actually build the dropdown menu.</p>
            <p>To open the dropdown menu, use a button or a link with a class of .dropdown-toggle and data-toggle="dropdown".</p>                                          
            <div class="dropdown">
                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                    <li><a href="#">HTML</a></li>
                    <li><a href="#">CSS</a></li>
                    <li><a href="#">JavaScript</a></li>
                </ul>
            </div>
        </div>
    </body>
</html>

【讨论】：

我认为这是评论，而不是答案。
@alirezasafian 是的，可以对此发表评论，但我认为展示如何做到这一点要好得多。