Fully parse Bootstrap form usage (Form button) _ javascript skills

This article comprehensively analyzes how to use the Bootstrap form. This article focuses on the Bootstrap form button. If you are interested, refer to it. I. Support for multiple tags

In additionYou can also useAnd labels.

Similarly, when creating buttons in the Bootstrap framework, in addition to the tag elements mentioned above, you can also use them on other tag elements. The only thing you need to note is that, to add the class name ". btn ".

ButtonA tag button span tag button

P tag button

Ii. customized Style

In the Bootstrap framework, different button styles are implemented by different class names.

Basic button. btnDefault button. btn-defaultMain button. btn-primarySuccessful button. btn-successWarning button. btn-warningDangerous button. btn-dangerLink button. btn-link

3. Button size

In the Bootstrap framework, the button size can also be customized.

In the Bootstrap framework, three class names are provided to control the button size:

Large button. btn-lgNormal buttonSmall button. btn-sm

4. Block button

The Bootstrap framework provides a class name ". btn-block ". The button uses this class name to fill the button with the entire container, and this button does not have any padding or margin values. In reality, such buttons are often called block buttons.

Large button. btn-lgNormal buttonSmall button. btn-smUltra-small button. btn-xs

5. Button disabling

In the Bootstrap framework, there are two ways to disable the button:

　　Method 1:Add the disabled attribute to the tag

　　Method 2:Add the class name "disabled" to the element label"

　　The main differences between the two are:

The ". disabled" style does not prohibit default button behaviors, such as submission and resetting.

You can add the "disabled" attribute to an element label to disable the default behavior of an element.

Disable by using the disabled attribute buttonDisable by adding the class name disabled

Today, I want to add some new knowledge to you:Bootstrap form prompt information

Different prompts must be provided during form verification. This effect is also provided in the Bootstrap framework. A "help-block" style is used to display the prompt information in blocks and at the bottom of the control.

The above is a detailed introduction to the Bootstrap form button. More content will be updated later. I hope you will continue to pay attention to it.