Twitter bootstrap 下拉菜单未在引导中显示_Twitter Bootstrap_Twitter Bootstrap 2

Twitter bootstrap 下拉菜单未在引导中显示

twitter-bootstrap

Twitter bootstrap 下拉菜单未在引导中显示,twitter-bootstrap,twitter-bootstrap-2,Twitter Bootstrap,Twitter Bootstrap 2,我正在尝试进入引导程序： <!DOCTYPE html> <html> <head> <title>Bootstrap 101 Template</title>  <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> </head> <body

我正在尝试进入引导程序：

<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 101 Template</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
  </head>
  <body>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="js/bootstrap.min.js"></script>

    <div class="dropdown">
      <!-- Link or button to toggle dropdown -->
      <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
        <li><a tabindex="-1" href="#">Action</a></li>
        <li><a tabindex="-1" href="#">Another action</a></li>
        <li><a tabindex="-1" href="#">Something else here</a></li>
        <li class="divider"></li>
        <li><a tabindex="-1" href="#">Separated link</a></li>
      </ul>
    </div>

  </body>
</html>


引导101模板

然而，什么也没有出现。我知道本地CSS和JS文件被正确引用。据我所知，默认的JS包含所有插件

编辑：谢谢大家的反馈。如果人们发现自己与我处于相同的情况，我只能在复制和粘贴片段之前加入教程。

来自：

看看下拉菜单，这里是所需的HTML。您需要将下拉菜单的触发器和下拉菜单包装在.dropdown或另一个声明position:relative；的元素中；。然后创建菜单

因此，您可能需要为

下拉列表

类设置CSS，使其具有（至少）

位置：relative。另外，默认情况下，您在下拉菜单上有一个显示：无。还可以尝试覆盖它。代替div，尝试使用父ul和li来包装您在上面发布的ul。
比如说,
    <ul class="nav nav-pills span7 pull-right" id="upper_username_hide">
       <li class= "dropdown" data-dropdown="dropdown">
         <a id="" class="dropdown-toggle" data-toggle="dropdown" href="#">
          <b class="caret dropdown-toggle"></b>
         </a>
         <ul class="dropdown-menu" >
          <li><a href="#">Action</a></li>
          <li><a href="#">Another action</a></li>
        </ul>
      </li>
    </ul> 










我不认为标签索引将是必要的，因为引导css解决了这个问题。
祝你好运
 我认为您的代码基本上是好的，但是您缺少了触发下拉列表的链接。见
请注意，我添加了
<a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>



下面是一个如何将其包含在
祝你好运
 请特别注意您代码中的注释
。您需要放置一个带有data toggle=“dropdown”属性的链接或按钮来激活下拉列表
试试这个：








在我的例子中，我发现下拉菜单
引导类已将top属性设置为：top:100%
，这导致下拉菜单显示在视口之外。我确实用另一个类重写了top值，现在正在工作
 谢谢，但我相信所提供的示例能够完成所需的.dropdown包装，不是吗？默认引导css中没有.dropdown
类，所以您必须这样做。再次感谢，但这并不能解决它。在任何情况下，my（unnified）bootstrap.css
在第2840行和第2843行之间具有声明.dropup、.dropdown{position:relative；}
。我手动添加了您的建议，但没有效果。默认情况下，您在下拉菜单上有一个显示：none
。试着克服它。再次谢谢你，米哈。我认为有一个更完整的例子说明了如何使用下拉列表。我知道我是个脾气暴躁的老头，但是。。。这种零碎的方法在应用于技术产品时令人不安。我想人们应该在尝试之前阅读所有的文档。此外，我的CSS知识远远落后于你的，但恰恰是我希望对CSS有一个非常粗略的理解，可以让我使用引导，而不是调整CSS本身！哦，好吧。。。再次感谢！你能把它放在一个JSFIDLE中吗？我以前从来没有用过JSFIDLE，所以我不确定是否一切正常，但它确实是。非常感谢。。。这是一个令人沮丧的企业试图学习引导。我希望官方的片段是独立的，但是，唉，我想他们希望你知道你在做什么。任何关于如何获得最低限度的HTML/CSS/JS知识以便正确利用引导的建议都将不胜感激。再次感谢。我知道你们所说的代码片段的使用并不总是像你们想象的那个样简单。我发现自己检查了很多HTML和CSS源代码来填补空白。我开始理解造型和脚手架背后的逻辑，但随着时间的推移，一切变得越来越容易；）谢谢冒着在评论中抛出许多开放式问题的风险。。。您如何着手建立对引导使用的理解？除了官方文件，还有什么推荐的资源吗？（tabindex设置是从官方代码片段中逐字复制的。）创建和试验引导类始终是最好的方法，但当您不知所措时，请尝试检查一些已经使用twitter引导的现有网站的代码。感谢提供这样一个清晰的示例。它告诉我，几个按钮/链接可以触发相同的下拉列表，以及引导文档的一些特性！