What is Bootstrap 5 table & how to make it responsive?

Bootstrap 5 Tables

Bootstrap 5 tables are basically series of rows and columns that contains data in a cell. Bootstrap table class is used to enhance the look of the table.

Basic Table

To create a Bootstrap 5 simple table, you have to add .table class to the <table> base class.

General Syntax

<table class="table"></table>

Dark table

To create a table with a dark background, use extra class .table-dark to the <table> base class i.e<table class="table table-dark">.

General Syntax

<table class="table table-dark">  </table>

Striped Dark Table

Apply .table-striped class to <table> base class. This class adds zebra stripes to a table.

General Syntax

<table class="table table-dark table-striped"></table>

Bordered Table

Apply .table-bordered class to <table> base class. This class adds borders on all sides of the table and cells.

General Syntax

<table class="table table-bordered"> </table>

Bootstrap Responsive Table

Apply .table-responsive{-sm|-md|-lg|-xl|-xxl} class to the <table>

General Syntax

<table class="table table-responsive table-responsive-sm">  </table>

Table Head Color

Apply .table-light or .table-dark class to <thead> base class. It creates a table with the light head using .table-lightthe class while as table dark head by using .table-dark class.

General Syntax

<thead class="table-light"></thead>
<thead class="table-dark"></thea

To read more about it, Bootstrap table click here.