案例:Bootstrap案例     状态:可编辑再运行    进入横版
x
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
    <meta charset="utf-8">
5
    <title>Bootstrap 实例 - 下拉菜单</title>
6
    <link rel="stylesheet" href="/css/bootstrap/bootstrap3.3.7.min.css">
7
    <script src="/js/bootstrap/jquery.min.js"></script>
8
    <script src="/js/bootstrap/bootstrap3.3.7.min.js"></script>
9
</head>
10
<body>
11
12
<div class="container">
13
  <h2>下拉菜单</h2>
14
  <p>.dropdown-header 类用于在下拉菜单中添加标题:</p>
15
  <div class="dropdown">
16
    <button class="btn btn-default dropdown-toggle" type="button" id="menu1" data-toggle="dropdown">教程
17
    <span class="caret"></span></button>
18
    <ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
19
      <li role="presentation" class="dropdown-header">下拉菜单标题 1</li>
20
      <li role="presentation"><a role="menuitem" tabindex="-1" href="#">HTML</a></li>
21
      <li role="presentation"><a role="menuitem" tabindex="-1" href="#">CSS</a></li>
22
      <li role="presentation"><a role="menuitem" tabindex="-1" href="#">JavaScript</a></li>
23
      <li role="presentation" class="divider"></li>
24
      <li role="presentation" class="dropdown-header">下拉菜单标题 2</li>

 运行结果 
 北美留学生论坛