Bootstrap CSS布局之按钮

前端之家收集整理的这篇文章主要介绍了Bootstrap CSS布局之按钮前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

按钮

是任何系统都不能缺少的组件,设置到按钮的大小、颜色、状态等。

按钮样式

btn-default、btn-primary、btn-success、btn-info、btn-warning、btn-danger、btn-link

按钮大小

btn-xs、btn-sm、btn-lg、btn-block

.btn { padding: 10px 16px; font-size: 18px; line-height: 1.3333333; border-radius: 6px; } .btn-sm,.btn-group-sm > .btn { padding: 5px 10px; font-size: 12px; line-height: 1.5; border-radius: 3px; } .btn-xs,.btn-group-xs > .btn { padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 3px; }

所有按钮的宽度都是文本的长短再加上padding值来决定,若我们需要一个充满父容器的100%宽度的按钮,则无法实现。所以有btn-block btn-block不根据文本收缩,也没有padding和margin值,而是充满父容器

标签支持

btn相关元素的强大之处,不仅能支持button元素,也能支持a元素和input元素

链接

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

猜你在找的Bootstrap相关文章