Can you explain how Bootstrap's utility classes work and give an example of how you would use them?

Bootstrap's utility classes are a set of pre-defined CSS classes that you can use to quickly add styles to elements on your website without having to write custom CSS. They are designed to be simple and easy to use and allow you to quickly change the layout, alignment, and other visual aspects of your website.

Utility classes are prefixed with .d-*, .text-*, .align-*, .justify-*, .bg-*, .p-*, .m-*, .w-*, .h-*, .rounded-*, .shadow-* and many other prefixes that you can use to quickly apply styles to elements on your website.

Here's an example of how you would use Bootstrap's utility classes to change the font size of a paragraph and add a background color:

<p class="text-primary text-center">This is a centered primary text</p> <p class="text-danger bg-light">This is a danger text with a light background</p>


In this example, the .text-primary class changes the text color to blue and the .text-center class centers the text. The .text-danger class changes the text color to red and the .bg-light class sets the background color to light gray.

Another example would be to change the margin and padding of an element:

<div class