Bootstrap下拉菜单

发布时间：2020-12-17 21:13:34 所属栏目：安全来源：网络整理

导读：很简单的方法，加载bootstrap的js执行dropdown的方法就可以。相关的js文件可以到我的资源里面下载学习。 !doctype htmlhtmlheadmeta charset="utf-8"titlebootstrap下拉菜单/titlelink rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/scrip

很简单的方法，加载bootstrap的js执行dropdown的方法就可以。相关的js文件可以到我的资源里面下载学习。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>bootstrap下拉菜单</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/bootstrap-dropdown.js"></script>
<script type="text/javascript">
$('.dropdown-toggle').dropdown()
</script>
</head>
<body>
<ul class="nav nav-pills">
  <li><a href="#">规则的链接</a></li>
  <li class="dropdown" id="menutest1"> <a class="dropdown-toggle" data-toggle="dropdown" href="#menutest1"> 下拉项 <b class="caret"></b> </a>
    <ul class="dropdown-menu">
      <li><a href="#">动作1</a></li>
      <li><a href="#">动作2</a></li>
      <li><a href="#">其他</a></li>
      <li class="divider"></li>
      <li><a href="#">被间隔的链接</a></li>
    </ul>
  </li>
  <li class='active'> <a data-toggle="dropdown" href="#menutest1">点击我看看</a> </li>
</ul>
</body>
</html>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!