Bootstrap中如何制作下拉菜单

1、打开HBuilder X，鼠标右键，新建一个项目，名字自己取。

2、打开新建项目中的js中的index.html。

3、引入JQuery、Bootstrap等插件，这里以CDN方式引入。

4、下拉菜单代码：

<div class="dropdown">

<button type="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 role="menuitem" tabindex="-1" href="#">Java</a>

</li>

<li role="presentation">

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

</li>

<li role="presentation">

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

</li>

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

<li role="presentation">

<a role="menuitem" tabindex="-1" href="#">计算机</a>

</li>

</ul>

</div>

5、这里下拉菜单名叫“书名”，子菜单分别是名字。

6、Ctrl+S保存，Ctrl+R运行，在游览器中运行时这样子的：