按钮大小与多标签支持

按钮大小与多标签支持

---

按钮大小

1.按钮的大小有大按钮、默认尺寸、小按钮和超小尺寸。

2.修改按钮的大小

<!-- Standard button -->

<button type="button" class="btn btn-default btn-lg">（默认样式）Default</button>

<!-- Provides extra visual weight and identifies the primary action in a set of buttons -->

<button type="button" class="btn btn-primary btn-sm">（首选项）Primary</button>

<!-- Indicates a successful or positive action -->

<button type="button" class="btn btn-success btn-xs">（成功）Success</button>

3.运行效果

4.我们已经知道一个按钮的大小和按钮里面的文本大小与按钮里面的文本和按钮之间的边距是有关系的，那如果我们要让一个按钮占满全屏。

<!-- Indicates caution should be taken with this action -->

<button type="button" class="btn btn-warning">（警告）Warning</button>

<hr/>

<!-- Indicates a dangerous or potentially negative action -->

<button type="button" class="btn btn-danger btn-block">（危险）Danger</button>

//btn-block就是把这个按钮做成块状的按钮，就是它的宽度要占满整个的容器。

<hr/>

<!-- Deemphasize a button by making it look like a link while maintaining button behavior -->

//按钮的默认大小就是文字加上按钮的边界。

<button type="button" class="btn btn-link">（链接）Link</button>

<hr/>

5.运行效果

---

多标签支持

1.多标签支持

<a href="a" class="btn btn-danger btn-lg disabled"role="button">大家好</a>

2.运行效果