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();
按钮选项
| None |
按钮方法
下表列出了所有可用的按钮方法。
注释: 方法也可以通过数据属性传递；将方法名称附加到 data-，如 data-toggle 或 data-dispose。
| 方法 | 描述 | 试一试 |
|---|---|---|
| .button("toggle") | 使按钮看起来被按下 | 测试一下 |
| .button("dispose") | 销毁元素的按钮 |
