作者在 2018-09-03 09:40:15 发布以下内容
| 样式 | 说明 |
|---|---|
| btn | 原始样式按钮 |
| btn-default | 默认按钮 |
| btn-primary | 提交按钮 |
| btn-success | 成功按钮 |
| btn-info | 信息按钮 |
| btn-warning | 警告按钮 |
| btn-danger | 危险按钮 |
| btn-link | 表现为链接 |
| btn-lg | 大按钮 |
| btn-sm | 小按钮 |
| btn-xs | 最小按钮 |
| btn-block | 宽屏按钮 |
| active | 激活状态按钮 |
| disabled | 禁用按钮 |
| disabled btn-danger btn-xs |
多种按钮样式混用 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="js/bootstrap/3.3.6/bootstrap.js"></script>
<link href="css/bootstrap/3.3.6/bootstrap.min.css" rel="stylesheet">
<script src="js/bootstrap/3.3.6/bootstrap.js"></script>
<p>
<button type="button" class="btn">原始样式按钮</button>
</p>
<p>
<button type="button" class="btn btn-default">默认按钮</button>
</p>
<p>
<button type="button" class="btn btn-primary">提交按钮</button>
</p>
<p>
<button type="button" class="btn btn-success">成功按钮</button>
</p>
<p>
<button type="button" class="btn btn-info">信息按钮</button>
</p>
<p>
<button type="button" class="btn btn-warning">危险按钮</button>
</p>
<p>
<button type="button" class="btn btn-link">表现为链接</button>
</p>
<p>
<button type="button" class="btn btn-lg">大按钮</button>
</p>
<p>
<button type="button" class="btn btn-sm ">小按钮</button>
</p>
<p>
<button type="button" class="btn btn-xs">最小按钮</button>
</p>
<p>
<button type="button" class="btn btn-block ">宽屏按钮</button>
</p>
<p>
<button type="button" class="btn btn-active">激活状态按钮</button>
</p>
<p>
<button type="button" class="btn btn-disabled">禁用按钮</button>
</p>
<p>
<button type="button" class="btn disabled btn-danger btn-xs">多种按钮样式混用</button>
</p>
</body>
</html>
如图所示: