<!doctype html> <html> <meta charset="utf-8" /> <head> <title>益司CMS-PC与手机建站集成</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <link rel="stylesheet" href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css"> <!--<link href="__PUBLIC__/bootstrap/css/bootstrap-theme.css" rel="stylesheet" />--> <!--[if It IE 9]> <script src="http//html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> </head> <body> <div class="container"> <h1 class="page-header">下拉菜单</h1> <p> <div class="btn-group"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </div> <div class="btn-group"> <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </div> </p> </div> <script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script> <script src="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script> <script type="text/javascript"> $(function(){ $('.dropdown-menu li').each(function(){ var obj= $(this); $(this).click(function(){ var html = ($(this).find('a').html()); $(this).parent().prev("button").html(html+" <span class=\"caret\"></span>"); }); }); }); </script> </body> </html>
bootstrap_11下拉菜单
原创xiaohongyangok 博主文章分类:HTML5与CSS3 ©著作权
©著作权归作者所有:来自51CTO博客作者xiaohongyangok的原创作品,请联系作者获取转载授权,否则将追究法律责任
上一篇:bootstrap_10图片
下一篇:bootstrap_12菜单栏
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
有趣的CSS - 汉堡菜单按钮
用 css 实现汉堡菜单图标与关闭图标过渡动画交互效果。
css 汉堡图标 动画 ux 交互体验 -
看懂OSSIM的WebUI菜单源码文件
本文详细介绍OSSIM前端WebUI菜单结构和代码注释
数组 OSSIM 汉化 -
Bootstrap 下拉菜单disabled
Bootstrap 下拉菜单disabled
下拉菜单 Bootstrap disabled -
bootstrap-按钮下拉菜单
bootstrap-按钮下拉菜单
按钮 bootstrap 拉菜单 -
bootstrap36-Bootstrap 下拉菜单
bootstrap36-Bootstrap 下拉菜单
下拉菜单 bootstrap -
bootstrap-下拉菜单(菜单标题)
bootstrap-下拉菜单(菜单标题)
下拉菜单 bootstrap 菜单标题 -
bootstrap38-Bootstrap 下拉菜单-标题
bootstrap38-Bootstrap 下拉菜单-标题
下拉菜单 bootstrap -
bootstrap3 多级下拉菜单
bootstrap3 多级下拉菜单
bootstrap 下拉菜单 -
bootstrap-下拉菜单(菜单项状态)
bootstrap-下拉菜单(菜单项状态)
菜单 下拉菜单 bootstrap