Bootstrap基本样式学习笔记之按钮(4)

Bootstrap中任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观，再结合一些选项，可以定义各种按钮样式。

0x01 按钮样式

 
 
 
 
 
 



 
 基本按钮
 
 

 Default
 Primary
 Success
 Info
 Warning
 Danger
 link
 

效果如下：

0x02 调节按钮大小

 
 
 
 
 
 


 
 
 调节按钮的大小
 
 大号按钮
 

 Default
 Primary
 Success
 Info
 Warning
 Danger
 link
 
 默认大小
 

 Default
 Primary
 Success
 Info
 Warning
 Danger
 link
 
 小号按钮
 

 Default
 Primary
 Success
 Info
 Warning
 Danger
 link
 
 微型按钮
 

 Default
 Primary
 Success
 Info
 Warning
 Danger
 link
 
 

效果如下：

0x03 其他按钮

移动端一个按钮占用一行按钮，可以利用.btn-block类来实现块状按钮。Bootsrap通过将announce背景色设置为50%褪色的方式来呈现无法点击的效果：

 
 
 
 
 
 



 
 其他按钮
 
 
 

 Block
 
 

 不可用按钮1
 不可用按钮2
 
 

效果如下：

如果大家还想深入学习，可以点击这里进行学习，再为大家附3个精彩的专题：

Bootstrap学习教程

Bootstrap实战教程

Bootstrap插件使用教程

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。