Bootstrap按钮菜单

当前位置 : 首页 > 网页制作 > CSS > Bootstrap按钮菜单

Bootstrap按钮菜单

来源: 作者: 时间:2016-01-14 16:13
按钮下拉菜单向按钮添加下拉菜单,只需要简单地在在一个 btn-group 中放置按钮和下拉菜单即可BootstrapDemo 按钮菜单 子菜单1

按钮下拉菜单

向按钮添加下拉菜单,只需要简单地在在一个 .btn-group 中放置按钮和下拉菜单即可

 

 








<script type="text/javascript" src = "../jquery-1.11.2.min.js"></script><script type="text/javascript" src = "../bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>

 

 

此处我们未使用div class = "dropdown",尽管dropdown也可以实现按钮下拉菜单,但是dropdown是块级显示的。而.btn-group

的display是inline-block.

效果:

\
 

分割的按钮下拉菜单

使用两个Button,一个显示内容,另一个用来显示下拉功能

 



效果:

 

\

 

按钮上拉菜单

只需要在.btn-group容器中添加.dropup即可。

 

 

 




 

\

 

Tag:
上一篇:Bootstrap排版
下一篇:Bootstrap输入框组
网友评论

<