Bold text.
Bolder weight text (relative to the parent element).
Normal weight text.
Light weight text.
Lighter weight text (relative to the parent element).
Italic text.
``` ## Colors > **[Colors](https://getbootstrap.com/docs/4.5/utilities/colors/)** > > Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too. ## Flex > **[Flex](https://getbootstrap.com/docs/4.5/utilities/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. ## Containers > **[Containers](https://getbootstrap.com/docs/5.0/layout/containers/)** > > Containers are a fundamental building block of Bootstrap that contain, pad, and align your content within a given device or viewport.  ## Grid System > **[Grid options - Grid system](https://getbootstrap.com/docs/5.1/layout/grid/#grid-options)** > > Bootstrap’s grid system uses a series of containers, rows, and columns to layout and align content. It’s built with flexbox and is fully responsive. Below is an example and an in-depth explanation for how the grid system comes together. | Use our...  ## Spacing > **[Spacing](https://getbootstrap.com/docs/5.1/utilities/spacing/)** > > Bootstrap includes a wide range of shorthand responsive margin, padding, and gap utility classes to modify an element’s appearance. Where _property_ is one of: - `m` - for classes that set `margin` - `p` - for classes that set `padding` Where _sides_ is one of: - `t` - for classes that set `margin-top` or `padding-top` - `b` - for classes that set `margin-bottom` or `padding-bottom` - `s` - (start) for classes that set `margin-left` or `padding-left` in LTR, `margin-right` or `padding-right` in RTL - `e` - (end) for classes that set `margin-right` or `padding-right` in LTR, `margin-left` or `padding-left` in RTL - `x` - for classes that set both `*-left` and `*-right` - `y` - for classes that set both `*-top` and `*-bottom` - blank - for classes that set a `margin` or `padding` on all 4 sides of the element Where _size_ is one of: - `0` - for classes that eliminate the `margin` or `padding` by setting it to `0` - `1` - (by default) for classes that set the `margin` or `padding` to `$spacer * .25` - `2` - (by default) for classes that set the `margin` or `padding` to `$spacer * .5` - `3` - (by default) for classes that set the `margin` or `padding` to `$spacer` - `4` - (by default) for classes that set the `margin` or `padding` to `$spacer * 1.5` - `5` - (by default) for classes that set the `margin` or `padding` to `$spacer * 3` - `auto` - for classes that set the `margin` to auto ## List Group > **[List group](https://getbootstrap.com/docs/5.0/components/list-group/)** > > List groups are a flexible and powerful component for displaying a series of content. Modify and extend them to support just about any content within.  ```auto ``` ## Images > **[Responsive images - Images](https://getbootstrap.com/docs/5.0/content/images/#responsive-images)** > > Images in Bootstrap are made responsive with .img-fluid. This applies max-width: 100%; and height: auto; to the image so that it scales with the parent element. | Documentation and examples for opting images into responsive behavior (so they never... **`img-fluid`** による幅100%自動イメージサイズ 所属エレメントの可変幅に応じてイメージ幅サイズも可変（表示領域幅100%、高さ自動） **`mx-auto d-block`** でセンター配置 ```auto