我的网页上有一张很长的桌子。当我打印它时，它看起来表的最后一行是在一页（仅在页面的顶部）。页面的其余部分为空白。在下一页我有巢表。我不知道，为什么下一个表不在第一页的最后一行的底部。
在HTML中以下列方式查看：
<table align="left" cellspacing="0" cellpadding="0" border="1">
<thead>
<tr>....</tr>
</thead>
<tbody>
<tr>...</tr>
</tbody>
</table>
<table align="center" width="800" cellspacing="0" cellpadding="0" border="1" style="margin: 0 auto 0 auto; page-break-inside: avoid;">
<tbody>
<tr>
<td align="left" width="200">xxx</td>
<td align="right" width="200">xxx</td>
<td align="right" width="200">xxx</td>
<td align="right" width="200">x</td>
</tr>
<tr>
<td align="left" width="200">
<td align="right" width="200">
<td align="right" width="200">
<td align="right" width="200">
</tr>
<tr></tr>
</table>
CSS：
background-color: white;
border: 1px solid #000000;
border-collapse: collapse;
border-spacing: 0;
font-size: 10px;
vertical-align: middle;
答案 0 :(得分：1)
试用此代码并进行打印预览。我把第二张表放在第一张表下面。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Print of HTML Page</title>
<style type="text/css">
table{
width: 800px;
background-color: white;
border: 1px solid #000000;
border-collapse: collapse;
border-spacing: 0;
font-size: 10px;
vertical-align: middle;
}
</style>
</head>
<body>
<table border="1">
<thead>
<tr>
<th>Table 1 Header</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Table 1 Footer</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Table 1 Row 1</td>
</tr>
<tr>
<td>Table 1 Row 2</td>
</tr>
<tr>
<td>Table 1 Row 3</td>
</tr>
<tr>
<td>Table 1 Row 4</td>
</tr>
<tr>
<td>Table 1 Row 5</td>
</tr>
<tr>
<td>Table 1 Row 6</td>
</tr>
<tr>
<td>Table 1 Row 7</td>
</tr>
<tr>
<td>Table 1 Row 8</td>
</tr>
<tr>
<td>Table 1 Row 9</td>
</tr>
<tr>
<td>Table 1 Row 10</td>
</tr>
<tr>
<td>Table 1 Row 11</td>
</tr>
<tr>
<td>Table 1 Row 12</td>
</tr>
<tr>
<td>Table 1 Row 13</td>
</tr>
<tr>
<td>Table 1 Row 14</td>
</tr>
<tr>
<td>Table 1 Row 15</td>
</tr>
<tr>
<td>Table 1 Row 16</td>
</tr>
<tr>
<td>Table 1 Row 17</td>
</tr>
<tr>
<td>Table 1 Row 18</td>
</tr>
<tr>
<td>Table 1 Row 19</td>
</tr>
<tr>
<td>Table 1 Row 20</td>
</tr>
<tr>
<td>Table 1 Row 21</td>
</tr>
<tr>
<td>Table 1 Row 22</td>
</tr>
<tr>
<td>Table 1 Row 23</td>
</tr>
<tr>
<td>Table 1 Row 24</td>
</tr>
<tr>
<td>Table 1 Row 25</td>
</tr>
<tr>
<td>Table 1 Row 26</td>
</tr>
<tr>
<td>Table 1 Row 27</td>
</tr>
<tr>
<td>Table 1 Row 28</td>
</tr>
<tr>
<td>Table 1 Row 29</td>
</tr>
<tr>
<td>Table 1 Row 30</td>
</tr>
<tr>
<td>Table 1 Row 31</td>
</tr>
<tr>
<td>Table 1 Row 32</td>
</tr>
<tr>
<td>Table 1 Row 33</td>
</tr>
<tr>
<td>Table 1 Row 34</td>
</tr>
<tr>
<td>Table 1 Row 35</td>
</tr>
<tr>
<td>Table 1 Row 36</td>
</tr>
<tr>
<td>Table 1 Row 37</td>
</tr>
<tr>
<td>Table 1 Row 38</td>
</tr>
<tr>
<td>Table 1 Row 39</td>
</tr>
<tr>
<td>Table 1 Row 40</td>
</tr>
<tr>
<td>Table 1 Row 41</td>
</tr>
<tr>
<td>Table 1 Row 42</td>
</tr>
<tr>
<td>Table 1 Row 43</td>
</tr>
<tr>
<td>Table 1 Row 44</td>
</tr>
<tr>
<td>Table 1 Row 45</td>
</tr>
<tr>
<td>Table 1 Row 46</td>
</tr>
<tr>
<td>Table 1 Row 47</td>
</tr>
<tr>
<td>Table 1 Row 48</td>
</tr>
<tr>
<td>Table 1 Row 49</td>
</tr>
</tbody>
</table>
<table border="1" style="page-break-inside: avoid;">
<tbody>
<tr>
<td>Table 2 Row 1 Cell 1</td>
<td>Table 2 Row 1 Cell 2</td>
<td>Table 2 Row 1 Cell 3</td>
<td>Table 2 Row 1 Cell 4</td>
</tr>
<tr>
<td>Table 2 Row 2 Cell 1</td>
<td>Table 2 Row 2 Cell 2</td>
<td>Table 2 Row 2 Cell 3</td>
<td>Table 2 Row 2 Cell 4</td>
</tr>
</table>
</body>
</html>
答案 1 :(得分：0)
您可以使用
分别控制用于打印的样式表@media print {
....
}
由于您的表在内部破坏，您可以使用
禁用它@media print {
table {
page-break-inside: avoid;
}
}