目录

Bootstrap4 JS 按钮

❮ 上一节下一节 ❯

按钮 CSS 类

有关按钮的教程，请阅读我们的Bootstrap 按钮教程。

下面的类可用于设置任何 <a>、<button> 或 <input> 元素的样式：

Class	Description	Example
`.btn`	Adds basic styling to any button	尝试一下
`.btn-block`	Makes a block-level button (spans the full width of the parent element)	尝试一下
`.btn-danger`	Indicates a dangerous or potentially negative action	尝试一下
`.btn-dark`	Dark grey button	尝试一下
`.btn-default`	Indicates a default/standard button	尝试一下
`.btn-info`	Contextual button for informational alert messages	尝试一下
`.btn-lg`	Makes a large button	尝试一下
`.btn-light`	Light grey button	尝试一下
`.btn-link`	Makes a button look like a link (will still have button behavior)	尝试一下
`.btn-outline-*`	Creates an outlined/bordered button. Use any of the contextual classes as * (btn-outline-primary, btn-outline-success, etc)	尝试一下
`.btn-primary`	Provides extra visual weight and identifies the primary action in a set of buttons	尝试一下
`.btn-sm`	Makes a small button	尝试一下
`.btn-success`	Indicates a successful or positive action	尝试一下
`.btn-secondary`	Indicates a "less" important action	尝试一下
`.btn-toolbar`	Combine sets of button groups into button toolbars for more complex components	尝试一下
`.btn-warning`	Indicates caution should be taken with this action	尝试一下
`.active`	Makes the button appear pressed	尝试一下
`.disabled`	Makes the button disabled	尝试一下

通过JavaScript

手动启用：

$('.btn').button();

按钮选项

None

按钮方法

下表列出了所有可用的按钮方法。

笔记：方法也可以通过数据属性传递；将方法名称附加到 data-，如 data-toggle 或 data-dispose 中。

Method	Description	尝试一下
.button("toggle")	Makes the button look pressed	尝试一下
.button("dispose")	Destroys an element's button

❮ 上一节下一节 ❯