如何将HTML表格分成两半并在打印时显示在一个页面上

Question

我的HTML中有一些包含多行的表。打印HTML时，表格会被切成两半，下一页会打印额外的行。有没有办法将表拆分为两个并在同一页面上垂直显示？

这是HTML：

#wrapTable {
  width: auto;
  border: 0px solid;
  display: block;
}

<div style="margin:0">
  <table id="wrapTable">
    <tr>
      <th> Col1 </th>
      <th> Col2 </th>
      <th> Col3 </th>
    </tr>
    <tr>
      <td> Row1 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row2 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row3 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row4 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row5 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row6 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row7 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row8 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row9 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row10 </td>
      <td> </td>
      <td> </td>
    </tr>
  </table>
  <table id="wrapTable">
    <tr>
      <td> Row11 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row12 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row13 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row14 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row15 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row16 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row17 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row18 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row19 </td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td> Row20 </td>
      <td> </td>
      <td> </td>
    </tr>
  </table>
</div>

我试图通过将表格分成两部分并将它们垂直地显示在一起来显示同一页面中的所有行。

Answer 1

我通过使用css属性获得了所需的结果＆＃34; display：inline＆＃34;。

＆＃13;

＆＃13;

port = new SerialPort('/dev/ttyS3', { baudrate: 57600 });

port.on('error', function(err) {
    console.log('Error: ', err.message);
});

port.on('data', function(buf) {
    console.log(buf);
});

＆＃13;

#wrapTable {
  width: auto;
  border: 0px solid;
  display: inline;
}

＆＃13;

＆＃13;

＆＃13;