首页 > 其他 > 详细

Bootstrap3系列:下拉菜单

时间:2016-09-04 22:13:39      阅读:160      评论:0      收藏:0      [点我收藏+]

1.引用Bootstrap

  示例引用的Bootstrap版本:v3.3.7

<script src="~/Scripts/jquery-2.2.4.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />

 2.基本使用

2.1 示例代码

<div class="dropdown">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
        下拉菜单<span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a href="#">菜单项1</a></li>
        <li><a href="#">菜单项2</a></li>
        <li><a href="#">菜单项3</a></li>
    </ul>
</div>

  .dropdown:定义下拉菜单框

  .dropdown-toggle:定义下拉菜单的触发元素

  data-toggle="dropdown":触发下拉菜单

  .dropdown-menu:定义下拉菜单条面板

2.2 示例效果

技术分享

Bootstrap3系列:下拉菜单

原文:http://www.cnblogs.com/libingql/p/5840460.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!