Learn Bootstrap 4: Utilities and Components
Bootstrap Utilities and Components

The Bootstrap framework allows us to streamline webpage layout and styling. In this lesson, we’re going to focus on using Bootstrap’s utility classes that provide additional styling and components that each serve distinct purposes.

Throughout this lesson, we’re going to become acquainted with Bootstrap’s extensive documentation. Bootstrap’s documentation offers a lot of important information and examples. For instance, we can follow Bootstrap’s Getting Started - Starter template to add the Bootstrap framework to our project!

After we’ve incorporated the necessary Bootstrap files, we can quickly style our elements using Bootstrap’s predefined CSS classes and take advantage of Bootstrap’s JavaScript files to incorporate a level of interactivity to our webpages.

Now that we’ve got the basics covered, we can bootstrap up our site!


Look at the code in index.html. Play around with the elements and their classes, i.e. remove a class and run your code to see what effect it has on the rendered webpage.

You can also check the Bootstrap documentation and search for the classes’ purpose.

Folder Icon

Sign up to start coding

Already have an account?