如何用溢出滚动设置tbody高度
我在设置高度宽度溢出滚动时遇到问题。
<style>
tbody{
height:50px;display:block;overflow:scroll
}
</style>
<h3>Table B</h3>
<table style="border: 1px solid red;width:300px;display:block">
<thead>
<tr>
<td>Name</td>
<td>phone</td>
</tr>
</thead>
<tbody style='height:50px;display:block;overflow:scroll'>
<tr>
<td>AAAA</td>
<td>323232</td>
</tr>
<tr>
<td>BBBBB</td>
<td>323232</td>
</tr>
<tr>
<td>CCCCC</td>
<td>3435656</td>
</tr>
</tbody>
</table>
我希望表B像表A一样有溢出滚动。
任何帮助将不胜感激。
非常感谢， 微米。
14 个答案:
答案 0 :(得分：168)
如果您希望tbody显示滚动条，请将其转换为block。
要保持table的行为，请将tr变为table。
均匀喷洒细胞，使用table-layout:fixed;
HTML测试的CSS：
table ,tr td{
border:1px solid red
}
tbody {
display:block;
height:50px;
overflow:auto;
}
thead, tbody tr {
display:table;
width:100%;
table-layout:fixed;/* even columns width , fix width of table too*/
}
thead {
width: calc( 100% - 1em )/* scrollbar is average 1em/16px width, remove it from thead width */
}
table {
width:400px;
}
如果tbody未显示滚动，因为内容小于height或max-height，请随时使用以下设置滚动：overflow-y:scroll;。的 DEMO 2
答案 1 :(得分：36)
使用滚动条到表格主体的简单方法
/* It is simple way to use scroll bar to table body*/
.tableBodyScroll tbody {
display: block;
max-height: 300px;
overflow-y: scroll;
}
.tableBodyScroll thead,
tbody tr {
display: table;
width: 100%;
table-layout: fixed;
}<table class="tableBodyScroll">
<thead>
<th>Invoice Number</th>
<th>Purchaser</th>
<th>Invoice Amount</th>
<th>Invoice Date</th>
</thead>
<tbody>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
<tr>
<td>INV-1233</td>
<td>Dinesh Vaitage</td>
<td>$300</td>
<td>01/12/2017</td>
</tr>
</tbody>
</table>
答案 2 :(得分：10)
默认情况下overflow不适用于表格组元素，除非您向display:block提供<tbody>，否则您必须提供position:relative和display: block <thead>。查看 DEMO 。
.fixed {
width:350px;
table-layout: fixed;
border-collapse: collapse;
}
.fixed th {
text-decoration: underline;
}
.fixed th,
.fixed td {
padding: 5px;
text-align: left;
min-width: 200px;
}
.fixed thead {
background-color: red;
color: #fdfdfd;
}
.fixed thead tr {
display: block;
position: relative;
}
.fixed tbody {
display: block;
overflow: auto;
width: 100%;
height: 100px;
overflow-y: scroll;
overflow-x: hidden;
}
答案 3 :(得分：3)
所有解决方案中的最简单的
：在CSS中添加以下代码：
.tableClassName tbody {
display: block;
max-height: 200px;
overflow-y: scroll;
}
.tableClassName thead,tbody tr {
display: table;
width: 100%;
table-layout: fixed;
}
.tableClassName thead {
width: calc( 100% - 1.1em );
}
1.1 em 是滚动条的平均宽度，请根据需要进行修改。
答案 4 :(得分：2)
基于this answer，如果您已经在使用Bootstrap，这是一个最小的解决方案：
div.scrollable-table-wrapper {
height: 500px;
overflow: auto;
thead tr th {
position: sticky;
top: 0;
}
}
<div class="scrollable-table-wrapper">
<table class="table">
<thead>...</thead>
<tbody>...</tbody>
</table>
</div>
在Bootstrap v3上测试
答案 5 :(得分：1)
更改您的第二个表格代码，如下所示。
<table style="border: 1px solid red;width:300px;display:block;">
<thead>
<tr>
<td width=150>Name</td>
<td width=150>phone</td>
</tr>
</thead>
<tbody style='height:50px;overflow:auto;display:block;width:317px;'>
<tr>
<td width=150>AAAA</td>
<td width=150>323232</td>
</tr>
<tr>
<td>BBBBB</td>
<td>323232</td>
</tr>
<tr>
<td>CCCCC</td>
<td>3435656</td>
</tr>
</tbody>
</table>
答案 6 :(得分：0)
我猜你正在尝试做的是保持标题固定并滚动正文内容。 您可以将内容滚动到两个方向：
- 水平：除非您使用滑块（例如jQuery滑块），否则您无法水平滚动内容。我建议在这种情况下避免使用表格。
- 垂直：您无法使用
tbody代码实现此目标，因为分配display:block或display:inline-block会破坏表格的布局。
以下是使用divs：JSFiddle
HTML：
<div class="wrap_header">
<div class="column">
Name
</div>
<div class="column">
Phone
</div>
<div class="clearfix"></div>
</div>
<div class="wrap_body">
<div class="sliding_wrapper">
<div class="serie">
<div class="cell">
AAAAAA
</div>
<div class="cell">
323232
</div>
<div class="clearfix"></div>
</div>
<div class="serie">
<div class="cell">
BBBBBB
</div>
<div class="cell">
323232
</div>
<div class="clearfix"></div>
</div>
<div class="serie">
<div class="cell">
CCCCCC
</div>
<div class="cell">
3435656
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
CSS：
.wrap_header{width:204px;}
.sliding_wrapper,
.wrap_body {width:221px;}
.sliding_wrapper {overflow-y:scroll; overflow-x:none;}
.sliding_wrapper,
.wrap_body {height:45px;}
.wrap_header,
.wrap_body {overflow:hidden;}
.column {width:100px; float:left; border:1px solid red;}
.cell {width:100px; float:left; border:1px solid red;}
/**
* @info Clearfix: clear all the floated elements
*/
.clearfix:after {
visibility:hidden;
display:block;
font-size:0;
content:" ";
clear:both;
height:0;
}
.clearfix {display:inline-table;}
/**
* @hack Display the Clearfix as a block element
* @hackfor Every browser except IE for Macintosh
*/
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */
说明：
您有sliding wrapper，其中包含所有数据。
请注意以下事项：
.wrap_header{width:204px;}
.sliding_wrapper,
.wrap_body {width:221px;}
有17px的差异，因为我们需要考虑滚动条的宽度。
答案 7 :(得分：0)
Webkit似乎在内部display: table-row-group用于tbody标记。
目前有一个设置高度的错误：https://github.com/w3c/csswg-drafts/issues/476
我们希望它能尽快得到解决。
答案 8 :(得分：0)
在我的情况下，我想要显示响应表高度而不是固定高度（以像素为单位）。为此，我使用了包含表格的div的可见高度属性百分比和溢出：
&__table-container {
height: 70vh;
overflow: scroll;
}
这样，表格将随着调整大小的窗口一起展开。
答案 9 :(得分：0)
HTML：
<table id="uniquetable">
<thead>
<tr>
<th> {{ field[0].key }} </th>
<th> {{ field[1].key }} </th>
<th> {{ field[2].key }} </th>
<th> {{ field[3].key }} </th>
</tr>
</thead>
<tbody>
<tr v-for="obj in objects" v-bind:key="obj.id">
<td> {{ obj.id }} </td>
<td> {{ obj.name }} </td>
<td> {{ obj.age }} </td>
<td> {{ obj.gender }} </td>
</tr>
</tbody>
</table>
CSS：
#uniquetable thead{
display:block;
width: 100%;
}
#uniquetable tbody{
display:block;
width: 100%;
height: 100px;
overflow-y:overlay;
overflow-x:hidden;
}
#uniquetable tbody tr,#uniquetable thead tr{
width: 100%;
display:table;
}
#uniquetable tbody tr td, #uniquetable thead tr th{
display:table-cell;
width:20% !important;
overflow:hidden;
}
这也将起作用：
#uniquetable tbody {
width:inherit !important;
display:block;
max-height: 400px;
overflow-y:overlay;
}
#uniquetable thead {
width:inherit !important;
display:block;
}
#uniquetable tbody tr, #uniquetable thead tr {
display:inline-flex;
width:100%;
}
#uniquetable tbody tr td, #uniquetable thead tr th {
display:block;
width:20%;
border-top:none;
text-overflow: ellipsis;
overflow: hidden;
max-height:400px;
}
答案 10 :(得分：0)
另一种方法是将表包装在可滚动的元素中，并将标题单元格设置在顶部。
这种方法的优点是您不必更改tbody上的显示，您可以将其留给浏览器来计算列宽，同时使标题单元格宽度与数据单元格列宽度保持一致。
/* Set a fixed scrollable wrapper */
.tableWrap {
height: 200px;
border: 2px solid black;
overflow: auto;
}
/* Set header to stick to the top of the container. */
thead tr th {
position: sticky;
top: 0;
}
/* If we use border,
we must use table-collapse to avoid
a slight movement of the header row */
table {
border-collapse: collapse;
}
/* Because we must set sticky on th,
we have to apply background styles here
rather than on thead */
th {
padding: 16px;
padding-left: 15px;
border-left: 1px dotted rgba(200, 209, 224, 0.6);
border-bottom: 1px solid #e8e8e8;
background: #ffc491;
text-align: left;
/* With border-collapse, we must use box-shadow or psuedo elements
for the header borders */
box-shadow: 0px 0px 0 2px #e8e8e8;
}
/* Basic Demo styling */
table {
width: 100%;
font-family: sans-serif;
}
table td {
padding: 16px;
}
tbody tr {
border-bottom: 2px solid #e8e8e8;
}
thead {
font-weight: 500;
color: rgba(0, 0, 0, 0.85);
}
tbody tr:hover {
background: #e6f7ff;
}<div class="tableWrap">
<table>
<thead>
<tr>
<th><span>Month</span></th>
<th>
<span>Event</span>
</th>
<th><span>Action</span></th>
</tr>
</thead>
<tbody>
<tr>
<td>January</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>February. An extra long string.</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>March</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>April</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>May</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>June</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>July</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>August</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>September</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>October</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>November</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
<tr>
<td>December</td>
<td>AAA</td>
<td><span>Invite | Delete</span></td>
</tr>
</tbody>
</table>
</div>
答案 11 :(得分：0)
制作滚动表始终是一个挑战。这是一种解决方案，其中桌子在tbody上以固定的高度水平和垂直滚动，从而使theader和tbody“粘住”（不显示：粘滞）。我添加了一个“大”表来显示。 我从G-Cyrillus那里得到灵感，使tbody展示： 但是，当涉及到单元格的宽度时（在标题和正文中），这取决于内部内容。因此，我在the单元格和tbody的最小第一行中添加了每个单元格内具有特定宽度的内容（其他行也进行了相应调整）
.go-wrapper {
overflow-x: auto;
width: 100%;
}
.go-wrapper table {
width: auto;
}
.go-wrapper table tbody {
display: block;
height: 220px;
overflow: auto;
}
.go-wrapper table thead {
display: table;
}
.go-wrapper table tfoot {
display: table;
}
.go-wrapper table thead tr,
.go-wrapper table tbody tr,
.go-wrapper table tfoot tr {
display: table-row;
}
.go-wrapper table th,
.go-wrapper table td {
white-space: nowrap;
}
.go-wrapper .aw-50 { min-height: 1px; width: 50px; }
.go-wrapper .aw-100 { min-height: 1px; width: 100px; }
.go-wrapper .aw-200 { min-height: 1px; width: 200px; }
.go-wrapper .aw-400 { min-height: 1px; width: 400px; }
/***** Colors *****/
.go-wrapper table {
border: 2px solid red
}
.go-wrapper table thead,
.go-wrapper table tbody,
.go-wrapper table tfoot {
outline: 1px solid green
}
.go-wrapper td {
outline: 1px solid blue
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Template</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<div class="container">
<div class="row mt-5 justify-content-md-center">
<div class="col-8">
<div class="go-wrapper">
<table class="table">
<thead>
<tr>
<th><div class="aw-50" ><div class="checker"><span><input type="checkbox" class="styled"></span></div></div></th>
<th><div class="aw-200">Name</div></th>
<th><div class="aw-50" >Week</div></th>
<th><div class="aw-100">Date</div></th>
<th><div class="aw-100">Time</div></th>
<th><div class="aw-200">Project</div></th>
<th><div class="aw-400">Text</div></th>
<th><div class="aw-200">Activity</div></th>
<th><div class="aw-50" >Hours</th>
<th><div class="aw-50" >Pause</div></th>
<th><div class="aw-100">Status</div></th>
</tr>
</thead>
<tbody>
<tr>
<td><div class="aw-50"><div class="checker"><span><input type="checkbox" class="styled"></span></div></div></td>
<td><div class="aw-200">AAAAA</div></td>
<td><div class="aw-50" >15</div></td>
<td><div class="aw-100">07.04.2020</div></td>
<td><div class="aw-100">10:00</div></td>
<td><div class="aw-200">Project 1</div></td>
<td><div class="aw-400">Blah blah blah</div></td>
<td><div class="aw-200">Activity</div></td>
<td><div class="aw-50" >2t</div></td>
<td><div class="aw-50" >30min</div></td>
<td><div class="aw-100">Waiting</div></td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>BBBBB</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>CCCCC</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah Blah blah blah</td>
<td>Activity Activity Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>DDDDD</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>EEEEE</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>FFFFF</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity Activity Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>GGGGG</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>HHHHH</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>IIIII</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>JJJJJ</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>KKKKK</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>LLLLL</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>MMMMM</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>NNNNN</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>OOOOO</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>PPPPP</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>QQQQQ</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>RRRRR</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>SSSSS</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>TTTTT</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>UUUUU</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>VVVVV</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>XXXXX</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>YYYYY</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>ZZZZZ</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>ÆÆÆÆÆ</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>ØØØØØ</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
<tr>
<td><div class="checker"><span><input type="checkbox" class="styled"></span></div></td>
<td>ÅÅÅÅÅ</td>
<td>15</td>
<td>07.04.2020</td>
<td>10:00</td>
<td>Project 1</td>
<td>Blah blah blah</td>
<td>Activity</td>
<td>2t</td>
<td>30min</td>
<td>Waiting</td>
</tr>
</tbody>
<tfoot>
<tr>
<th><div class="aw-50" ><div class="checker"><span><input type="checkbox" class="styled"></span></div></div></th>
<th><div class="aw-200">Name</div></th>
<th><div class="aw-50" >Week</div></th>
<th><div class="aw-100">Date</div></th>
<th><div class="aw-100">Time</div></th>
<th><div class="aw-200">Project</div></th>
<th><div class="aw-400">Text</div></th>
<th><div class="aw-200">Activity</div></th>
<th><div class="aw-50" >Hours</th>
<th><div class="aw-50" >Pause</div></th>
<th><div class="aw-100">Status</div></th>
</tr>
</tfoot>
</table>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
</body>
</html>
答案 12 :(得分：-1)
对我来说，只需添加两行即可
th {
position: sticky;
top: 0;
}
答案 13 :(得分：-1)
这是表格在 x 和 y 方向上滚动的一个很好的例子。 水平和垂直滚动是响应式表格的最佳选择。
table, th, tr, td {
border: 1px solid lightgrey;
border-collapse: collapse;
}
tbody {
max-height: 200px;
max-width: 200px;
overflow: auto;
display: block;
table-layout: fixed;
}
tr {
display: table;
}<table>
<thead>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
</tr>
</thead>
<tbody>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
</tr>
<tr>
<th>
<input type="checkbox">
</th>
<td>2</td>
<td>3</td>
</tr>
</tbody>
</table>
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？