Bootstrap input box Group

Bootstrap input box Group

Input box groups are extended by Form Controls. Using input box groups, you can easily add text or buttons as prefixes and suffixes to text-based input boxes.

You can add a public element to a user by adding a prefix or suffix to the input domain. For example, you can add dollar signs or

Add @ or other common elements required by the application interface.

To add a prefix or suffix element to. form-control, follow these steps:

• Place the prefix or suffix element in a class. input-group.
• Next, place additional content in the same class as. input-group-addon.
• Place this inThe front or back of an element. To maintain cross-browser compatibility, avoid using

 

Because they cannot be completely rendered in the WebKit browser. Do not apply the class of the input box group to the form group directly. The input box group is an isolated component. Basic Input box group: % 3 Cmeta % 20http-equiv % 3D % 22content-type % 22% 20 content % 3D % 22 text % 2 Fhtml % 3 Bcharset % 3Dutf-8% 22% 20% 2F % 3E % 3 Cmeta % 20http-equiv % 3D % 22X-UA-Compatible % 22% 20 content % 3D % 22IE % 3 Dedge % 22% 3E % 3 Cmeta % 20 name % 3D % 22 Keywords % 22% 20 content % 3D % 22% E5 % 85% B3 % E9 % 94% AE % E8 % AF % 8D % E4 % B8 % 80% EF % BC % 8C % E5 % 85% B3 % E9 % 94% AE % E8 % AF % 8D % E4 % BA % 8C % 22% 3E % 3 Cmeta % 20 name % 3D % 22 Description % 22% 20 content % 3D % 22% E7 % BD % 91% E7 % AB % 99% E6 % 8F % 8F % e8 % BF % B0 % E5 % 86% 85% E5 % AE % B9 % 22% 3E % 3 Cmeta % 20 name % 3D % 22 Author % 22% 20 content % 3D % 22 Yvette % 20Lau % 22% 3E % 3 Cmeta % 20 name % 20% 3D % 20% 22 viewport % 22% 20 content % 20% 3D % 20% 20 width % 22% 3D % 20device-width % 2C % 20initial-scale % 20% 3D % 201% 20% 22% 3E BootstrapDemo failed % 22% 3E @

 
. 00
$. 00 

 

Add. input-group-lg or. input-group-sm or. input-group-xs to. input-group-xs to change the size of the input box.

The form part is the same.

 

Check box and radio plug-in You can use the check box and radio plug-in as the prefix or suffix element of the input box group. (Put the check box or single choice in span)

 

 

 

 

 

Button plug-in Change. input-group-addon to. input-group-btn to wrap the button.

 

 

 

 

 

 

Button with drop-down menu To add a button with a drop-down menu to the input box group, simply wrap the button and drop-down menu in A. input-group-btn class.