Shulou(Shulou.com)06/02 Report--

This article mainly introduces what style buttons bootstrap has, which can be used for reference by interested friends. I hope you will gain a lot after reading this article. Let's take a look at it with you.

Bootstrap style buttons are: 1, ".btn" rounded gray button; 2, ".btn-lg" big button; 3, ".btn-sm" small button; 4, ".btn-xs" ultra-small button; 5, ".btn-block" block-level button; 6, ".button" disable style button and so on.

Operating environment of this tutorial: Windows7 system, bootsrap3.3.7 version, DELL G3 computer

Bootstrap button style summary class style description .btn rounded gray button, in order to make the button less sharp, our buttons should use this style to get rounded corners, and then override other features. .btn-default default / standard button, press gray if white. .btn-primary original button style (unmanipulated), which corresponds to active, which is the style of a button that is not manipulated, and active is the corresponding style displayed when the button is clicked. .btn-success indicates a successful action .btn-info this style can be used for buttons that pop up messages. Btn-warning indicates a button that needs to be handled carefully. Btn-danger represents a button operation of a dangerous action. Btn-link makes the button look like a link (still retains button behavior). Btn-lg large button .btn-sm small button. Btn-xs ultra-small button .btn-block block-level button (stretch to 100% width of the parent element). Active button is clicked The button will appear as a pressed appearance (dark background, dark border, shadow) when activated. If you disable the button, the color will fade by 50% and the gradient will be lost.

Basic button set

Button 1 Button 2 Button 3

The size of the button

Button 1 Button 2 Button 3 Button 4 Button 5 Button 6 Button 7 Button 8 Button 9

Thank you for reading this article carefully. I hope the article "what style Button for bootstrap" shared by the editor will be helpful to you. At the same time, I also hope that you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.