我想在每个页面的末尾添加边框,下面是我的代码。
我尝试过 page-break-inside: auto;但由于此页面从第二页开始,下面是我的 html 结构。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Care Plan Printing Sample</title>
<style>
@media print {
@page {
size: A4 landscape;
margin: 10mm;
}
}
</style>
</head>
<body>
<h1>Care Plan Report</h1>
<div class="content">
<table class="table table2">
<tr>
<td class="left-align"><h6>Resident Name: Test</h6></td>
<td class="right-align"><h6>Care Plan Issue Date: 11-12-2024</h6></td>
</tr>
<tr>
<td class="left-align"><h6>Bed No / Room No: A10/104</h6></td>
<td class="right-align"><h6>Responded By: hvcbbjdhdgbvc</h6></td>
</tr>
<tr>
<td class="left-align"><h6>Register Date: 11-12-2024</h6></td>
<td></td> <!-- Empty right cell for alignment -->
</tr>
</table>
<table class="table mt-4 table3">
<thead>
<tr>
<th style="width:10%!important">Category</th>
<th style="width:20%!important">Goal</th>
<th style="width:35%!important">Plan</th>
<th style="width:20%!important">Schedule</th>
<th style="width:15%!important">Evaluation</th>
</tr>
</thead>
<tbody>
<tr>
<td>G1</td>
<td>G1</td>
<td>G1</td>
<td>G1</td>
<td>G1</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
目前它看起来像这样如果我添加 page-break-inside: auto;然后它看起来像这样。
提前致谢。
仅仅给页面添加边框不是不起作用吗?
<style>
@media print {
@page {
size: A4 landscape;
margin: 10mm;
border-bottom: 1px solid;
}
}
</style>