请教打印网页时，为什么有时会打印出重影？应该如何修复？

alober · #1

访问同一个内网，有8台电脑，其中6台都能正常打印出想要的效果，但另2台打印时（打印预览时的效果也一样），有一台会打印出一条横线，另一台会打印出重影，打印出重影的如下图所示：

请教这是什么原因？应该如何修复？要修改html代码吗？我在两个表格中间加了一个 p 标签，有 page-break-after: always; 想让它分页打印。如果去掉这个标签，打印预览时是正常的，但不能分页。

补充一下，这个打印出重影的地方，只有 th 标签所在的那行，其它行都没有重影。

原本的代码大致如下，表格内容是 js 从服务器获取的，没有写出来：

代码：全选

<!DOCTYPE HTML>
<html>
<head>
<style>
.flup_address {
	width: 6cm;
}
.flup_name {
	width: 1.5cm;
}
.flup_phone {
	width: 2.8cm;
}
.flup_flag {
	width: 1cm;
}
.flup_danger {
	width: 2cm;
}
.flup_drug {
	width: 15.4cm;
}
.flup_other {
	width: 2cm;
}

.fflup_address {
	width: 6cm;
}
.fflup_name {
	width: 3cm;
}
.fflup_phone {
	width: 5cm;
}
.fflup_flag {
	width: 15cm;
}
th {
	text-align: center;
}

table.fflup tr {
    height: 2.5em;
}
</style>
<script>
function print_page() {
	// 清除顶部标题、设置时间等等
	$('.fflup_other').hide();
}
</script>
</head>
<body>
<a href="javascript:void(0);" onclick="print_page();">打印</a></div>

<div class="collect" style="width: 29.7cm">
<table style="border-collapse: collapse; word-wrap: break-word; word-break: break-all; border: 1px solid #3E80B0; margin: 1px auto; width: 29.5cm">
<caption>一览表，团队：第<input id="team_num_str" type="text" value="" style="width: 1cm;" />团队，</span>成员<input type="text" size="12em" /><input id="flup_time_str" type="date" min="2018-01-01" max="2050-12-31" /></caption>
<thead>
<tr>
<th class="flup_address">住户地址</th>
<th class="flup_name">住户名</th>
<th class="flup_phone">联系电话</th>
<th class="flup_flag">标识</th>
<th class="flup_danger">危险</th>
<th class="flup_other">其它</th>
</tr>
</thead>
<tbody id="fset">

</tbody>
</table>
</div>

<p style="page-break-after: always;">　</p>

<div class="collect" style="border-width: 0; width: 29.7cm;">
<table class="fflup" style="border-collapse: collapse; word-wrap: break-word; word-break: break-all; border: 1px solid #3E80B0; margin: 1px auto; width: 29.5cm">
<caption><strong style="font-size: 1.5em; font-family: 黑体;">一览表</strong></caption>
<caption><span style="float: left;">入户时间：<span id="fflup_time"> </span></span><span style="float: right;">团队：第<span id="fflup_team_num"> </span>团队</span></caption>
<thead>
<tr>
<th class="fflup_name">姓名</th>
<th class="fflup_address">住户地址</th>
<th class="fflup_phone">联系电话</th>
<th class="fflup_flag">备注</th>
<th class="fflup_other">删除</th>
</tr>
</thead>
<tbody id="ffset">

</tbody>
</table>
</div>
</body>
</html>