How to use bootstrap components

This article will explain in detail how to use bootstrap components. The editor thinks it is very practical, so I share it with you for reference. I hope you can get something after reading this article.

Bootstrap components are used, you can access the component library https://v3.bootcss.com/components/, we can view all the component information of bootstrap and use it.

I. the use of font icons

The name under these icons is the corresponding class name. We can access the class name directly when we use it:

Bootstrap font icon

Second, the use of button components

Note: there are seven button styles: btn-default, btn-primary, btn-info, btn-success, btn-warning, btn-danger and btn-link.

There are three button sizes: btn-lg, btn-sm and btn-xs

In addition, a type like input can also style buttons in bootstrap.

The default primary message determines the prompt to unlink Link Button

Button drop-down menu

First, there must be a drop-down menu div container, and the style should be set to dropdown;. Secondly, the button style of the drop-down menu should be set to dropdown. In addition, the value of the aria-labelledby attribute in the ul of the last drop-down menu of id; should correspond to the value of id in button!

Dropdown Dropdown header Action Another action Something else here Separated link

Button groups and nesting

Button groups can also be set in size: btn-group-lg, btn-group-sm, btn-group-xs

LeftMiddle Right Dropdown Dropdown link Dropdown link

5. Vertical button group

A btn-group-vertical class can implement

LeftMiddle Right

6. Align button sets at both ends

LeftMiddleRight on "how to use bootstrap components" this article is shared here, I hope the above content can be of some help to you, so that you can learn more knowledge, if you think the article is good, please share it out for more people to see.