Bootstrap 5 Table Anatomy

Bootstrap 5 Table Anatomy contains three parts of table-head, table-foot & captions, you may think about where is the body as I did in tables but there are no classes for that. We can decorate the body part by using different classes like background color classes or text color classes.

Bootstrap 5 Table Anatomy:

• Table head: Table head .table- class is used to set the thead elements' background color.
• Table foot: Table foot does not require any class to set the table foot, but we can change its background color .
• Captions: Caption class is used to set the position of the caption on the top-left corner of the table.

Below example illustrates the Bootstrap 5 Table Anatomy:

Example 1: In this example, we will have a table that will have a black background header with a table footer and a caption.

Output:

👁 Image

Example 2: In this example, we will have a table that will have a light background header with a table footer and a caption.

Output:

👁 Bootstrap 5 Table Anatomy

Reference: https://getbootstrap.com/docs/5.0/content/tables/#anatomy