Bootstrap 3-导航栏下拉菜单不适用于额外的HTML页面

debugcn 发表于 Dev

ck777

我已经在Dreamweaver中使用Bootstrap 3及以下版本创建了一个网站。

我使用了navbar default并对其进行了自定义。

我刚刚在网站上添加了一些额外的页面，例如about.html和blog.html

但是，在这些额外的页面上，下拉菜单似乎不起作用。使用完全相同的代码，它在首页上确实可以正常工作。

我已经用<li>包装好了，只需按如下所示将所有html复制并粘贴到我的新html文件中，以使导航栏位于每个页面上。请告知我做错了什么，我几乎是一个完整的初学者。谢谢！

<div class="header clearfix">
    <nav class="text-center">
        <ul class="nav nav-pills">
            <li role="presentation" class="active"><a href="#">Home</a></li>
            <li>
                <a href="#" class="dropdown-toggle" data-toggle="dropdown"   role="button" aria-haspopup="true" aria-expanded="false">Our Services <span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="#">jhdhalbalb</a></li>
                    <li><a href="#">hdjdjjdj</a></li>
                    <li><a href="#">bdjdshbd</a></li>
                </ul>
            </li>
            <li role="presentation"><a href="About us.html">About us</a></li>
            <li role="presentation"><a href="Blog.html">Blog</a></li>
            <li role="presentation"><a href="#">Contact</a></li> 
        </ul>
    </nav>
</div>

雅各布灵顿

将其添加到所有页面的头部：

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

有时引导本地文件不起作用-这样做会让您知道是否应该重新下载它们。这是我以前发生的事情。

另外，您的HTML十分混乱，很难真正浏览。尝试稍微清理一下并确保您遵循W3标准，以便您可以遵循自己的代码，而其他人也可以阅读。

您还应该阅读以下内容：http : //getbootstrap.com/javascript/#dropdowns Bootstrap下拉列表需要一个额外的.js插件。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。