<!doctype html> <html> <head> <meta charset="utf-8"> <title>按钮</title> <link href="../../BootStrap/bootstrap-3.3.5-dist/css/bootstrap.css" rel="stylesheet" /> <meta name="viewport" content="width=device-wdith,initia-scale=1.0"> <!--[if lt IE 9]> <script src="http://html$shim.googlecode.com/svn/trunk/html5.js"></script>> <!--[endif]--> </head> <body> <script src="../../BootStrap/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script> <script src="../../BootStrap/bootstrap-3.3.5-dist/js/bootstrap.js"></script> <script src="../../BootStrap/bootstrap-3.3.5-dist/js/bootstrap-dropdown.js"></script>@*下拉*@框 <div class="container"> <h1 class="page-header">按钮<small>按钮的基本样式</small></h1> <div> 常规按钮 </div> <button type="button" class="btn btn-sm"> <span class="glyphicon " aria-hidden="true"></span>小按钮 </button> <button type="button" class="btn "> <span class="glyphicon " aria-hidden="true"></span>常规按钮 </button> <button type="button" class="btn btn-lg "> <span class="glyphicon " aria-hidden="true"></span>大按钮 </button> <div> 带图标按钮 </div> @*带图标按钮*@ <div> <button type="button" class="btn btn-info"> <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>添加 </button> <button type="button" class="btn btn-info"> <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>删除 info </button> <button type="button" class="btn btn-success"> <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭 success </button> <button type="button" class="btn btn-warning"> <span class="glyphicon glyphicon-arrow-down" aria-hidden="true"></span>导入 warning </button> <button type="button" class="btn btn-danger"> <span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span>导出 danger </button> <button type="button" class="btn btn-primary"> <span class="glyphicon glyphicon-search" aria-hidden="true"></span>查询 primary </button> <button type="button" class="btn btn-inverse"> <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>刷新 inverse </button> </div> @*按钮组*@ <div> 按钮组 </div> <div class="btn-group" role="group" aria-label="..."> <button type="button" class="btn btn-default">Left</button> <button type="button" class="btn btn-default">Middle</button> <button type="button" class="btn btn-default">Right</button> </div> @*下拉框*@ <div> 下拉框 </div> <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 新生需求 <span class="caret"></span> </button> <ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> <li><a href="#">后台配置</a></li> <li><a href="#">新生报到</a></li> <li><a href="#">报表分析</a></li> </ul> </div> </div> </body> </html>