怎样使用Bootstrap按钮-创新互联

小编给大家分享一下怎样使用Bootstrap按钮，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！

创新互联建站是网站建设技术企业，为成都企业提供专业的做网站、网站建设，网站设计，网站制作，网站改版等技术服务。拥有10年丰富建站经验和众多成功案例，为您定制适合企业的网站。10年品质，值得信赖！

Bootstrap 按钮

如何使用 Bootstrap 按钮。任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观。但是 Bootstrap 提供了一些选项来定义按钮的样式，具体如下表所示：

以下样式可用于, , 或 元素上：

下面的实例演示了上面所有的按钮 class：

默认按钮

原始按钮 成功按钮 信息按钮 警告按钮 危险按钮 链接按钮

效果

按钮大小

下表列出了获得各种大小按钮的 class：

 大的原始按钮
 大的按钮


 默认大小的原始按钮
 默认大小的按钮


 小的原始按钮
 小的按钮


 特别小的原始按钮
 特别小的按钮


 块级的原始按钮
 块级的按钮

效果

按钮状态

Bootstrap 提供了激活、禁用等按钮状态的 class，下面将进行详细讲解。

激活状态

按钮在激活时将呈现为被按压的外观（深色的背景、深色的边框、阴影）。

下表列出了让按钮元素和锚元素呈激活状态的 class：

 默认按钮
 激活按钮


 原始按钮
 激活的原始按钮

禁用状态

当您禁用一个按钮时，它的颜色会变淡 50%，并失去渐变。

下表列出了让按钮元素和锚元素呈禁用状态的 class：

下面的实例演示了这点：

 默认按钮
 禁用按钮


 原始按钮
 禁用的原始按钮


 链接
 禁用链接


 原始链接
 禁用的原始链接

效果

按钮标签

您可以在 、 或 元素上使用按钮 class。但是建议您在 元素上使用按钮 class，避免跨浏览器的不一致性问题。

下面的实例演示了这点：

链接
按钮

看完了这篇文章，相信你对“怎样使用Bootstrap按钮”有了一定的了解，如果想了解更多相关知识，欢迎关注创新互联网站建设公司行业资讯频道，感谢各位的阅读！

另外有需要云服务器可以了解下创新互联建站www.cdcxhl.com，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

新闻名称：怎样使用Bootstrap按钮-创新互联
网页路径：http://6mz.cn/article/djjogc.html