本文给大家介绍bootstrap按钮相关知识，包括按钮大小、按钮状态、按钮标签相关样式定义，对bootstrap按钮相关知识感兴趣的朋友一起学习吧
描述
Bootstrap Button（按钮）JavaScript 插件允许您加强按钮的功能。您可以控制按钮的状态，也可以为组件创建按钮组，比如工具条。
什么是必需的
您必须引用 jquery.js 和 bootstrap-button.js - 这两个 JavaScript 文件。它们都位于 docs/assets/js 文件夹内。
如何使用它
您可以不编写任何 JavaScript 只通过标记使用该插件，也可以通过 JavaScript 启用按钮。
Bootstrap 提供了一些选项来定义按钮的样式，具体如下表所示：
以下样式可用于,
| 类 | 描述 |
|---|---|
| .btn | 为按钮添加基本样式 |
| .btn-default | 默认/标准按钮 |
| .btn-primary | 原始按钮样式（未被操作） |
| .btn-success | 表示成功的动作 |
| .btn-info | 该样式可用于要弹出信息的按钮 |
| .btn-warning | 表示需要谨慎操作的按钮 |
| .btn-danger | 表示一个危险动作的按钮操作 |
| .btn-link | 让按钮看起来像个链接 (仍然保留按钮行为) |
| .btn-lg | 制作一个大按钮 |
| .btn-sm | 制作一个小按钮 |
| .btn-xs | 制作一个超小按钮 |
| .btn-block | 块级按钮(拉伸至父元素100%的宽度) |
| .active | 按钮被点击 |
| .disabled | 禁用按钮 |
首先看下不同颜色的按钮：
BootstrapDemo
效果：
btn-default / btn-primary /btn-success/ btn-info/ btn-warning/ btn-danger/ btn-link给按钮加上了不同的样式。
按钮大小
鉴于head部分都是相同的，只列出Body的内容。
效果如下所示：
按钮状态
按钮分为active和disabled两种状态、
激活状态：按钮呈现出被按压的外观，即背景颜色变深、深色边框和阴影。
禁用状态：按钮颜色会变淡 50%，并失去渐变
看具体的例子：
按钮标签
a,input都可以表现的像一个按钮，但是避免跨浏览器不一致，最好使用Button标签。
以上内容给大家介绍了Bootstrap按钮相关知识，希望大家喜欢。
以上就是详解Bootstrap按钮的详细内容，更多请关注0133技术站其它相关文章！
