<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Document </title>
<style type="text/css">
.fixed_header{
width: 400px;
}
.fixed_header thead {
background: black;
color:#fff;
}
.fixed_header th, .fixed_header td {
padding: 5px;
text-align: left;
width: 200px;
}
.fixed_header tbody{
display:block;
overflow:auto;
height:200px;
width:100%;
}
.fixed_header thead tr{
display:block;
}
</style>
</head>
<body>
<table class="fixed_header">
<thead>
<tr>
<th> Col 1 </th>
<th> Col 2 </th>
<th> Col 3 </th>
<th> Col 4 </th>
<th> Col 5 </th>
</tr>
</thead>
<tbody>
<tr>
<td> row 1-0 </td>
<td> row 1-1 </td>
<td> row 1-2 </td>
<td> row 1-3 </td>
<td> row 1-4 </td>
</tr>
<tr>
<td> row 2-0 </td>
<td> row 2-1 </td>
<td> row 2-2 </td>
<td> row 2-3 </td>
<td> row 2-4 </td>
</tr>
<tr>
<td> row 3-0 </td>
<td> row 3-1 </td>
<td> row 3-2 </td>
<td> row 3-3 </td>
<td> row 3-4 </td>
</tr>
<tr>
<td> row 4-0 </td>
<td> row 4-1 </td>
<td> row 4-2 </td>
<td> row 4-3 </td>
<td> row 4-4 </td>
</tr>
<tr>
<td> row 5-0 </td>
<td> row 5-1 </td>
<td> row 5-2 </td>
<td> row 5-3 </td>
<td> row 5-4 </td>
</tr>
<tr>
<td> row 6-0 </td>
<td> row 6-1 </td>
<td> row 6-2 </td>
<td> row 6-3 </td>
<td> row 6-4 </td>
</tr>
<tr>
<td> row 7-0 </td>
<td> row 7-1 </td>
<td> row 7-2 </td>
<td> row 7-3 </td>
<td> row 7-4 </td>
</tr>
</tbody>
</table>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title> Document </title>
<style type="text/css">
.fixed_header{
width: 400px;
}
.fixed_header thead {
background: black;
color:#fff;
}
.fixed_header th, .fixed_header td {
padding: 5px;
text-align: left;
width: 200px;
}
.fixed_header tbody{
display:block;
overflow:auto;
height:200px;
width:100%;
}
.fixed_header thead tr{
display:block;
}
</style>
</head>
<body>
<table class="fixed_header">
<thead>
<tr>
<th> Col 1 </th>
<th> Col 2 </th>
<th> Col 3 </th>
<th> Col 4 </th>
<th> Col 5 </th>
</tr>
</thead>
<tbody>
<tr>
<td> row 1-0 </td>
<td> row 1-1 </td>
<td> row 1-2 </td>
<td> row 1-3 </td>
<td> row 1-4 </td>
</tr>
<tr>
<td> row 2-0 </td>
<td> row 2-1 </td>
<td> row 2-2 </td>
<td> row 2-3 </td>
<td> row 2-4 </td>
</tr>
<tr>
<td> row 3-0 </td>
<td> row 3-1 </td>
<td> row 3-2 </td>
<td> row 3-3 </td>
<td> row 3-4 </td>
</tr>
<tr>
<td> row 4-0 </td>
<td> row 4-1 </td>
<td> row 4-2 </td>
<td> row 4-3 </td>
<td> row 4-4 </td>
</tr>
<tr>
<td> row 5-0 </td>
<td> row 5-1 </td>
<td> row 5-2 </td>
<td> row 5-3 </td>
<td> row 5-4 </td>
</tr>
<tr>
<td> row 6-0 </td>
<td> row 6-1 </td>
<td> row 6-2 </td>
<td> row 6-3 </td>
<td> row 6-4 </td>
</tr>
<tr>
<td> row 7-0 </td>
<td> row 7-1 </td>
<td> row 7-2 </td>
<td> row 7-3 </td>
<td> row 7-4 </td>
</tr>
</tbody>
</table>
</body>
</html>