Textual form controls—like <input>s, <select>s, and <textarea>s—are styled with the .form-control class. Included are styles for general appearance, focus state, sizing, and more.
For file inputs, swap the .form-control for .form-control-file.
Set horizontally scrollable range inputs using .form-control-range.
Add the readonly boolean attribute on an input to prevent modification of the input’s value. Read-only inputs appear darker (just like disabled inputs), but retain the standard cursor.
If you want to have <input readonly> elements in your form styled as plain text, use the .form-control-plaintext class to remove the default form field styling and preserve the correct margin and padding..
Set heights using classes like .form-control-lg and .form-control-sm.
By default, any number of checkboxes and radios that are immediate sibling will be vertically stacked and appropriately spaced with .form-check.
Add .position-static to inputs within .form-check that don’t have any label text. Remember to still provide some form of label for assistive technologies.
Group checkboxes or radios on the same horizontal row by adding .form-check-inline to any .form-check.
Add the disabled boolean attribute on an input to prevent user interactions and make it appear darker.