Learning Bootstrap
- Part 1: Installing and Using
- Part 2: Containers and Rows
- Part 3: Grids
- Part 4: Working with jQuery Plugins
Using Bootstrap
Bootstrap is a free and open-source front-end framework for designing HTML- and CSS-based applications.
Forms
In Bootstrap 4, the existing HTML Form element should contain other elements with the class form-group. Within these elements should be at least two others, a label element and the input element with which it is paired.
Label elements should have an attribute for with the same value as the id of the input element with which they are associated. Such labels help with not only assistive technology, but can visually differentiate the different input elements.
Form Control
To help with styling elements, Bootstrap supplies the form-control class. HTML elements like Input, Textarea, and Select should use this class to help with consistent styling. The class form-control-file should be used for Input element with the type “file.”
Form Sizes
Bootstrap also supplies three sizes to use in conjunction with the form-control class: form-control-lg (large), form-control (default), and form-control-sm (small).
Form Grid
Like other elements, forms can also use the grid system in Bootstrap. Within a Form element, the use of the classes row and col can be used to create the same grid layout.
