Bootstrap下拉菜单

原创 2013年12月03日 22:26:42

很简单的方法,加载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>


Bootstrap在导航栏上用下拉菜单并保持对齐

Bootstrap简直就是前速成的宝典尽管bootstrap很牛逼,但是在实际运用中还是会有一些问题,比如: 出现了不对齐的情况,我们看看代码: ...
  • tydyz
  • tydyz
  • 2017年07月25日 20:07
  • 498

玩转Bootstrap(基础) -- (5.下拉菜单)

在使用Bootstrap框架的下拉菜单时,必须调用Bootstrap框架提供的bootstrap.js文件。当然,如果你使用的是未编译版本,在js文件夹下你能找到一个名为“dropdown.js”的文...

bootstrap中jquery插件——下拉菜单

这篇是用来记录怎样为应用了bootstrap下拉菜单组件的元素引用下拉菜单插件的,其实无论使用bootstrap中哪一个插件都有两种方式: 一种是直接使用data-*扩展属性,这是 Bootstr...

Bootstrap 字体图标和下拉菜单、按钮

Bootstrap 字体图标http://www.runoob.com/try/demo_source/bootstrap3-glyph-icons.htm使用; ...

解决bootstrap下拉菜单无法隐藏的问题

解决bootstrap下拉菜单无法隐藏的问题

3.1Bootstrap学习组件篇之下拉菜单、图标

本文章转载于http://blog.csdn.net/a316212802/article/details/24940577 1、Glyphicons图标 包括200个来自Glyphicon ...

bootstrap开发网页之导航栏(下拉菜单 响应式)

现代浏览器博物馆 body {padding-top: 70px;} ...

Bootstrap——按钮,按钮组,图片,文字,背景,下拉菜单

按钮.btn 为按钮添加基本样式.btn-default 默认/标准按钮 .btn-primary 原始按钮样式(未被操作) .btn-success 表示...

Bootstrap源码解读1 下拉菜单

Bootstrap源码解读1 下拉菜单 转载自:Bootstrap源码解读下拉菜单(4)   这篇文章主要源码解读了Bootstrap下拉菜单,介绍了Bootstrap各式各样的下拉菜单,具有一定的参...

bootstrap入门【下拉菜单】

link href="bootstrap.min.css" rel="stylesheet"> 引入bootstrap外部样式表 script src="jquery-2.1.3.min.js">...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Bootstrap下拉菜单
举报原因:
原因补充:

(最多只允许输入30个字)