DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>固定表头可以纵向滚动的html表格title>
<style type="text/css">
#table_div{
width:80%;
margin-left: 50px;
}
#table_header{
background-color: #7fffd4;
}
.col1,.col2,.col3{
width: 20%
}
.col4{
width:40%;
}
style>
head>
<body>
<div id="table_div">
<table width="100%">
<tr id="table_header">
<th class="col1">学号th>
<th class="col2">姓名th>
<th class="col3">年级th>
<th class="col4">家庭住址th>
tr>
table>
<div style="overflow:auto;height:100px">
<table width="100%">
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
<tr>
<td class="col1">11111111td>
<td class="col2">张三td>
<td class="col3">2013级td>
<td class="col4">吉林省长春市前进大街2699号td>
tr>
table>
div>
div>
body>
html>
京公网安备 11010802041100号