Bootstrap 4 JS 按钮
按钮 CSS 类
有关按钮的教程，请阅读我们的 Bootstrap 按钮教程。
以下类可用于为任何<a>、<button> 或<input> 元素设置样式
| 类 | 描述 | 示例 |
|---|---|---|
.btn |
为任何按钮添加基本样式 | 试一试 |
.btn-block |
使按钮成为块级元素（跨越父元素的全部宽度） | 试一试 |
.btn-danger |
表示危险或潜在的负面操作 | 试一试 |
.btn-dark |
深灰色按钮 | 试一试 |
.btn-default |
表示默认/标准按钮 | 试一试 |
.btn-info |
用于信息警报消息的上下文按钮 | 试一试 |
.btn-lg |
创建大型按钮 | 试一试 |
.btn-light |
浅灰色按钮 | 试一试 |
.btn-link |
使按钮看起来像链接（仍具有按钮行为） | 试一试 |
.btn-outline-* |
创建带边框的按钮。使用任何上下文类作为 *（btn-outline-primary、btn-outline-success 等） | 试一试 |
.btn-primary |
提供额外的视觉权重，并在按钮集中识别主要操作 | 试一试 |
.btn-sm |
创建小型按钮 | 试一试 |
.btn-success |
表示成功或积极的操作 | 试一试 |
.btn-secondary |
表示“不太重要”的操作 | 试一试 |
.btn-toolbar |
将按钮组组合成按钮工具栏以创建更复杂的组件 | 试一试 |
.btn-warning |
表示应谨慎执行此操作 | 试一试 |
.active |
使按钮看起来像被按下 | 试一试 |
.disabled |
使按钮禁用 | 试一试 |
通过 JavaScript
使用以下方法手动启用
$('.btn').button();
按钮选项
| 无 |
按钮方法
下表列出了所有可用的按钮方法。
注意：方法也可以通过数据属性传递；将方法名称附加到 data-，如 data-toggle 或 data-dispose。
| 方法 | 描述 | 试一试 |
|---|---|---|
| .button("toggle") | 使按钮看起来像被按下 | 试一试 |
| .button("dispose") | 销毁元素的按钮 |
