Bootstrap JS 按鈕
JS 按鈕 (button.js)
如果您想對按鈕進行更多控制，請使用此外掛。
有關按鈕的教程，請閱讀我們的 Bootstrap 按鈕教程。
按鈕外掛類
下面的類可用於設定任何 <a>、<button> 或 <input> 元素的樣式
| 類 | 描述 | 示例 |
|---|---|---|
| .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 | 使按鈕失效 | 試一試 |
透過 JavaScript
使用以下命令手動啟用：
$('.btn').button();
按鈕選項
| 無 |
按鈕方法
下表列出了所有可用的按鈕方法。
注意： 對於此外掛，也可以透過 data 屬性傳遞方法；將方法名稱附加到 data-，例如 data-toggle 或 data-loading。
| 方法 | 描述 | 試一試 |
|---|---|---|
| .button("toggle") | 使按鈕看起來為按下狀態 | 試一試 |
| .button("loading") | 停用按鈕並將按鈕文字更改為“loading...” | 試一試 |
| .button("reset") | 將按鈕文字更改為原始文字（如果已更改） | 試一試 |
| .button("string") | 指定新的按鈕文字 | 試一試 |
更多示例
使用 CSS 自定義按鈕
如何移除圓角邊框
如何新增特定顏色
示例
.btn-default {
background: #000;
color: #fff;
}
.btn-default:hover {
background: #fff;
color: #000;
}
自己動手試一試 »
如何新增陰影
