Bootstrap classes

All Bootstrap utilities and content classes are included and recommended for use. Leveraging these classes ensures development and styling consistency, and helps to prevent CSS bloat.

Content

Reboot

Reboot, a collection of element-specific CSS changes in a single file, kickstart Bootstrap to provide an elegant, consistent, and simple baseline to build upon.

Code

Documentation and examples for displaying inline and multiline blocks of code with Bootstrap.

Images

Documentation and examples for opting images into responsive behaviour (so they never become larger than their parent elements) and add lightweight styles to them—all via classes.

Figures

Documentation and examples for displaying related images and text with the figure component in Bootstrap.

Utilities

Borders

Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.

Clearfix

Quickly and easily clear floated content within a container by adding a clearfix utility.

Close icon

Use a generic close icon for dismissing content like modals and alerts.

Colours

Convey meaning through colour with a handful of colour utility classes. Includes support for styling links with hover states, too.

Display

Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.

Embeds

Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.

Flex

Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.

Float

Toggle floats on any element, across any breakpoint, using our responsive float utilities.

Image replacement

Swap text for background images with the image replacement class.

Overflow

Use these shorthand utilities for quickly configuring how content overflows an element.

Position

Use these shorthand utilities for quickly configuring the position of an element.

Screen readers

Use screen reader utilities to hide elements on all devices except screen readers.

Shadows

Add or remove shadows to elements with box-shadow utilities.

Sizing

Easily make an element as wide or as tall with our width and height utilities.

Spacing

Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.

Stretched link

Make any HTML element or Bootstrap component clickable by “stretching” a nested link via CSS.

Text

Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.

Vertical alignment

Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.

Visibility

Control the visibility, without modifying the display, of elements with visibility utilities.