列印表格，保證tr中間不分頁

參考： https://cdc.tencent.com/2014/08/19/print-%E8%A2%AB%E5%9F%8B%E6%B2%A1%E7%9A%84media-type/

整體思路：設定tr内部不分頁，給td設定右下邊框，再給第一列和末行的td分别設定border-left和border-bottom來充當table的左下邊框。最後設定表頭樣式為一條線，充當表格的上邊框，設定每頁列印表頭，以保證分頁後的表格有上邊框

注意：不要直接給table設定border，分頁以後底部會有斷線

具體步驟如下（此處使用scss編寫）：

1、設定tr内部不分頁

tr {
    page-break-inside: avoid;
}
           

2、td設定右下邊框，注意不能給table設定border

$dark: #333;

td {
    border-right: 1px solid $dark;
    border-bottom: 1px solid $dark;
}
           

3、第一列和末行的td分别設定border-left和border-bottom，畫出table的左下邊框

tr {
    &:nth-last-child(1) {
       td {
           border-bottom: 1px solid $dark;
       }
    }
}
           

4、設定表頭樣式為一條線，充當表格的上邊框，設定每頁列印表頭，以保證分頁後的表格有上邊框

<thead>
    <tr class="head-tr">
        <td colspan="7"></td>
    </tr>
</thead>
           

thead {
    display:table-header-group;
    .head-tr {
        height: 1px !important;
    }
}