Explain the Bootstrap basic table?

<table> - It is used for wrapping element for displaying data in a tabular format
<thead> - It is used for container element for table header rows (<tr>) to label table columns.
<tbody> - It is used for container element for table rows (<tr>) in the body of the table.
<tr> - It is used for container element for a set of table cells (<td> or <th>) that appears on a single row.
<th> - Special table cell for column (or row) labels. It must be used within a <thread>
<td> - It is used for default table cell.
<caption> - It is used for description or summary of what the table holds.

Bootstrap Basic Table

We can create a basic Bootstrap table with basic styling that has a small cell padding and only horizontal dividers by adding Bootstrap class ".table" to the <table> element.

Example

Bootstrap Basic Table using .table class.

In this example we will create a simple table with Bootstrap class and using html table elements we will create an employee table with Fields Sr. No., Employee Name, Email, City by writing the following code.

<!DOCTYPE html>  
<html lang="en">  
  
<head>  
    <meta charset="utf-8">  
    <title>Bootstrap Part5</title>  
    <meta name="viewport" content="width=device-width,initial-scale=1">  
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">  
</head>  
  
<body>  
    <div class="container">  
        <h1>Bootstrap Basic Table</h1>  
        <!--Bootstrap Basic Table using .table class-->  
        <table class="table">  
            <thead>  
                <tr>  
                    <th>Sr.No.</th>  
                    <th>Emolpyee Name</th>  
                    <th>Email</th>  
                    <th>City</th>  
                </tr>  
            </thead>  
            <tbody>  
                <tr>  
                    <td>1</td>  
                    <td>Shaili Dashora</td>  
                    <td>[email protected] </td>  
                    <td>Chittorgarh</td>  
                </tr>  
                <tr>  
                    <td>2</td>  
                    <td>Sourabh Somani</td>  
                    <td>[email protected] </td>  
                    <td>Banglore</td>  
                </tr>  
                <tr>  
                    <td>3</td>  
                    <td>Shobhna Singvi</td>  
                    <td>[email protected]</td>  
                    <td>Mumbai</td>  
                </tr>  
            </tbody>  
        </table>  
    </div>  
    <script src="js/jquery-2.1.4.min.js"></script>  
    <script src="js/bootstrap.min.js"></script>  
</body>  
  
</html>  

Output

Basic Table Layout,