Bootstrap Table
Advertisements
Design Table Using Bootstrap
Using bootstrap you can easily design your table style. We can create different types of Bootstrap tables by using different classes to style them.
The basic Bootstrap table has a light padding and only horizontal dividers. The .table class is used to add basic styling to a table.
Bootstrap Basic Table Example
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
</head>
<body>
<div class="container">
<h1>Basic Table Example</h1>
<table class="table">
<tr><th>Id</th><th>Name</th><th>Age</th></tr>
<tr><td>101</td><td>Varsha</td><td>21</td></tr>
<tr><td>102</td><td>Gaurav</td><td>25</td></tr>
<tr><td>103</td><td>Harry</td><td>26</td></tr>
<tr><td>104</td><td>Sonam</td><td>22</td></tr>
</table>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>
Output
Google Advertisment