bootstrap36-Bootstrap 下拉菜单

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>Bootstrap 下拉菜单</title>

<link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">

</head>

<body>

<div class="container">

<div class="dropdown">

<button class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">

主题

<span class="caret"></span>

</button>

<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">

<li role="presentation">

<a href="" role="menuitem" tabindex="-1" >java</a>

</li>

<li role="presentation">

<a role="menuitem" tabindex="-1" href="#">数据挖掘</a>

</li>

<li role="presentation">

<a role="menuitem" tabindex="-1" href="#">数据通信/网络</a>

</li>

<li role="presentation" class="divider"></li>

<li role="presentation">

<a role="menuitem" tabindex="-1" href="#">分离的链接</a>

</li>

</ul>

</div>

</div>

<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>

</body>

</html>

时间: 2024-11-07 01:30:14

bootstrap36-Bootstrap 下拉菜单的相关文章

Bootstrap下拉菜单

[Bootstrap 下拉菜单] <div class="dropdown"> <button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">主题 <span class="caret"></span> </but

Bootstrap 下拉菜单disabled

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Bootstrap 下拉菜单</title> <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"&g

Bootstrap下拉菜单的认识误区

Bootstrap下拉菜单HTML有两种写法: 一.内置式: <div class="dropdown">     <button class="btn btn-primary" data-toggle="dropdown">         下拉菜单         <span class="caret"></span>     </button>     <

安卓微信中bootstrap下拉菜单无法正常工作的解决方案

bootstrap下拉菜单组件描述:http://v3.bootcss.com/components/#dropdowns 问题环境:安卓4.4.2,微信6.2内置浏览器,bootstrap 3.1.1.1 问题描述:bootstrapV3的下拉菜单组件,在ios的微信浏览器中表现正常,但安卓微信浏览器中无法正常触发,安卓非微信浏览器可以触发 问题触发条件:未知 解决方案:去除button元素的属性data-toggle="dropdown",自己另外写一小段事件监听代码来切换div.

bootstrap下拉菜单插件

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Bootstrap 下拉菜单</title> <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"&g

Bootstrap 下拉菜单(Dropdowns)

本章将重点介绍 Bootstrap 下拉菜单.下拉菜单是可切换的,是以列表格式显示链接的上下文菜单.这可以通过与 下拉菜单(Dropdown) JavaScript 插件 的互动来实现. 如需使用下拉菜单,只需要在 class .dropdown 内加上下拉菜单即可.下面的实例演示了基本的下拉菜单: <div class="dropdown"> <button type="button" class="btn dropdown-toggl

bootstrap——下拉菜单右对齐

通过向 .dropdown-menu 添加 .pull-right 类来向右对齐下拉菜单. Bootstrap默认情况下,下拉菜单自动沿着父元素的上沿和左侧被定位为 100% 宽度. 为 .dropdown-menu 添加 .dropdown-menu-right 类可以让菜单右对齐.

[moka同学笔记]yii2.0的下拉菜单与bootstrap下拉菜单

1.yii2下拉菜单 1 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">管理<b class="caret"></b></a> 2 <ul class="dropdown-menu"> 3 <li&

Bootstrap下拉菜单dropdown-menu

1.步骤 (1)要做为下拉菜单的li增加class="dropdown" (2)为li中文字添加超链接<a data-toggle="dropdown" class="dropdown-toggle" href="#">书籍<b class="caret"></b></a> (3)li>ul添加<ul class="dropdown-me

bootstrap 下拉菜单-按钮与列表的完美组合

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,