button:btn 圆角灰色按钮
button:btn btn-default 圆角灰色边框按钮
button:btn btn-success 绿色
button:btn btn-primary 蓝色
button:btn btn-info 浅蓝
button:btn btn-warning 黄色
button:btn btn-danger 红色
button:btn btn-link 链接按钮改
btn-lg,btn-sm 按钮变大,变小
active 按下状态
btn-block 撑满父级,全屏
属性:disabled="disabled"禁用按钮
把链接变成按钮 <a class="btn btn-danger" href="">这是</a>
小练习:
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
7 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
8 <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
9 </head>
10 <body>
11 <button class="btn btn-default btn-lg">这是一个按钮</button>
12 <button class="btn btn-default btn-sm">这是一个按钮</button>
13 <button class="btn btn-default">这是一个按钮</button>
14 <button class="btn btn-success">这是一个按钮</button>
15 <button class="btn btn-primary">这是一个按钮</button>
16 <button class="btn btn-info">这是一个按钮</button>
17 <button class="btn btn-warning">这是一个按钮</button>
18 <button class="btn btn-danger">这是一个按钮</button>
19 <button class="btn btn-link">这是一个按钮</button>
20 </body>
21 </html>
示例代码