How can Bootstrap tables have several rows and columns?

edit

Bootstrap tables can have several rows and columns by adding multiple HTML tags and elements within the <table> and <tr> tags. We can use the <th> tag for table header and <td> tag for table cell. The code below demonstrates how to create a basic Bootstrap table with multiple rows and columns:

<table class="table">
  <thead>
    <tr>
      <th>Header 1</th>
      <th>Header 2</th>
      <th>Header 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Row 1, Column 1</td>
      <td>Row 1, Column 2</td>
      <td>Row 1, Column 3</td>
    </tr>
    <tr>
      <td>Row 2, Column 1</td>
      <td>Row 2, Column 2</td>
      <td>Row 2, Column 3</td>
    </tr>
    <!-- Add more rows as needed -->
  </tbody>
</table>

We can customize the table further using Bootstrap classes such as table-bordered for a bordered table, table-hover for adding hover effects, and table-striped for adding striped rows.