你能写一个bootstrap3.0实现三级下拉菜单示例
时间: 2024-05-14 08:13:18 浏览: 207
Bootstrap 3多级下拉菜单实例
可以的,请看下面的示例代码:
```html
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">下拉菜单示例</a>
</div>
<ul class="nav navbar-nav">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">菜单1 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">子菜单1.1</a></li>
<li><a href="#">子菜单1.2</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">子菜单1.3 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">子菜单1.3.1</a></li>
<li><a href="#">子菜单1.3.2</a></li>
</ul>
</li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">菜单2 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">子菜单2.1</a></li>
<li><a href="#">子菜单2.2</a></li>
</ul>
</li>
<li><a href="#">菜单3</a></li>
</ul>
</div>
</nav>
```
运行效果如下:
![bootstrap下拉菜单示例图](https://img-blog.csdn.net/20161103175905760 "bootstrap下拉菜单示例图")
当然,你可以根据实际需求修改菜单的内容和样式,这里只是一个基础示例。
阅读全文