打印动态table - 如何制作尽可能好

Question

我正在动态生成 table N 列 x M 行

我正在尝试使用默认打印选项尽可能好地打印它

所以，

每当我们在A1/A2/A3/A4纸上打印table时，table应该尽量占满一张纸，它可用space最大尽可能的字体（会看的人可能视力不佳）

但是当我使用例如 Microsoft Edge 时（它有操作缩放、边距和其他东西的工具，所以这就是我使用它的原因，这也让我有点担心，Chrome/FF/Edge 上的打印结果可能会有所不同）

并使用预览 (CTRL+P)，然后它总是占用超过一页，或者只使用例如 40% 的可用 space

A4纸，无边距：

fit to the printing area:

real size:

部分代码：

<!DOCTYPE html>
<html lang="pl-PL">
<head>
<title>Plan zajęć</title>

<style>         
    .printable-tables 
    {
        white-space: nowrap;
    }

    .printable-tables > table 
    {
        display: inline-table;
    }

    @page 
    {
        size: landscape;
    }

    .printable-tables > table 
    {
        page-break-before: always;
        page-break-after: always;
    }

    .header_low_height
    {
    }

    *
    {
    }

    table,
    th,
    td 
    {
        border: 1px solid black;
        padding-left: 5px;
        padding-right: 5px;
    }

    tr td
    {
        border-right-style: solid;
        border-right-width: 1pt;
        border-bottom-style: solid;
        border-bottom-width: 1pt;
        padding-right: 5.4pt;
        padding-left: 5.65pt;
        text-align: center
    }

    .vert 
    {
        writing-mode: vertical-lr;
    }

    th {
    }

    .td_low_height
    {
    }


    .dayName 
    {
        padding: 8px;
        text-align: center;
        font-weight: bold;
    }

    .rotate 
    {
        transform: translateX(-30%) rotate(0.5turn);
    }

    .top_border 
    {
        border-top: 3px solid black
    }
</style>

</head>
<body>
    <table style="border: 1pt solid #000000; border-collapse:collapse">
        <tr class="header_low_height">
            <th rowspan="2" style=""> 
                <p><span>Kolejność godzin lekcyjnych</span></p>
            </th>
            
            <th colspan="31" style=""> 
                <p><span>Nauczyciele <br> (przydział godzin lekcyjnych w klasach)</span></p>
            </th>
        </tr>
        
        <tr class="header_low_height">
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>         
            <td class="vert dayName">John Kovalsky</td>     
        </tr>

        <tr>            
            <td>1. 07:55:00 - 08:40:00</td>         
            <td>-</td>          
            <td>OPa</td>            
            <td>IV</td>         
            <td>-</td>          
            <td>IIIB</td>           
            <td>-</td>          
            <td>IA</td>         
            <td>VIIB</td>           
            <td>VIII</td>           
            <td>-</td>          
            <td>IIIA</td>           
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>0</td>          
            <td>IB</td>         
            <td>-</td>          
            <td>OPb</td>            
            <td>II</td>         
            <td>-</td>          
            <td>-</td>          
            <td>VIIA</td>           
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>VI</td>         
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>V</td>
        </tr>
        <tr>            
            <td>2. 08:50:00 - 09:35:00</td>         
            <td>-</td>          
            <td>OPa</td>            
            <td>V</td>          
            <td>-</td>          
            <td>IIIB</td>           
            <td>-</td>          
            <td>IA</td>         
            <td>IV</td>         
            <td>VIII</td>           
            <td>-</td>          
            <td>IIIA</td>           
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>0</td>          
            <td>II</td>         
            <td>-</td>          
            <td>OPb</td>            
            <td>IB</td>         
            <td>-</td>          
            <td>-</td>          
            <td>VIIB</td>           
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>VIIA</td>           
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>VI</td>
        </tr>
        <tr>            
            <td>3. 09:45:00 - 10:30:00</td>         
            <td>-</td>          
            <td>OPa</td>            
            <td>VIIB</td>           
            <td>-</td>          
            <td>IIIB</td>           
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>V</td>          
            <td>-</td>          
            <td>IIIA</td>           
            <td>II</td>         
            <td>-</td>          
            <td>VI</td>         
            <td>0</td>          
            <td>IA</td>         
            <td>-</td>          
            <td>OPb</td>            
            <td>-</td>          
            <td>IB</td>         
            <td>-</td>          
            <td>VIII</td>           
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>IV</td>         
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>VIIA</td>
        </tr>
        <tr>            
            <td>4. 10:40:00 - 11:25:00</td>         
            <td>-</td>          
            <td>OPa</td>            
            <td>VIII</td>           
            <td>-</td>          
            <td>IIIB</td>           
            <td>-</td>          
            <td>-</td>          
            <td>VI</td>         
            <td>-</td>          
            <td>-</td>          
            <td>IIIA</td>           
            <td>II</td>         
            <td>-</td>          
            <td>VIIB</td>           
            <td>0</td>          
            <td>-</td>          
            <td>-</td>          
            <td>OPb</td>            
            <td>IA</td>         
            <td>IB</td>         
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>-</td>          
            <td>V</td>          
            <td>IV</td>         
            <td>-</td>          
            <td>-</td>          
            <td>VIIA</td>
        </tr>
    </table>
</body>
</html>

完整代码如下（由于字符数限制）：

https://pastebin.com/raw/36UuuPZy

如何正确打印巨大的 tables？！ :O

Answer 1

我查看了您的代码，对其进行了一些修改并使其正常运行...希望您满意。为了满足 Whosebug 的 30,000 个字符限制，我减少了下面代码中的字符。要获取完整代码，请转到 Fit-To-Print-Area : GitHub Gist 。您可以在下面找到结果的屏幕截图

    <!DOCTYPE html>
    <html lang="pl-PL">
    <head>
    <title>Plan zajęć</title>
    <!-- 32 cols-->
    <style>        
    @page 
    {
    size: landscape;
    }
    body {
    font-size: 10pt;
    font-family: Garamond, Serif;
    }
    table {
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 1.2em;
    }
    td, th {
    padding: 0;
    border: 1px solid #000000;
    }
    tr.tableTitle {
    font-size: 1.2em;
    font-weight: bold;
    text-align:center;
    background: #d0d0d0;
    }
    thead tr {
    font-weight: bold;
    background: #f0f0f0;
    text-align:center;
    }
    @media print {
    table{
    font-size:1vw;
    }
    }
    </style>
    </head>
    <body>
    <table>
    <tr class="header_low_height">
        <th rowspan="2"> 
            <p><span>Kolejność godzin lekcyjnych</span></p>
        </th>
        
        <th colspan="31"> 
            <p><span>Nauczyciele <br> (przydział godzin lekcyjnych w klasach)</span></p>
        </th>
    </tr>

    <tr class="header_low_height">
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>         
        <td class="vert dayName">John Kovalsky</td>     
    </tr>

    <tr>            
        <td>1. 07:55:00 - 08:40:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>IV</td>         
        <td>-</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>IA</td>         
        <td>VIIB</td>           
        <td>VIII</td>           
        <td>-</td>          
        <td>IIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>0</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>OPb</td>            
        <td>II</td>         
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>V</td>
    </tr>
    <tr>            
        <td>2. 08:50:00 - 09:35:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>V</td>          
        <td>-</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>IA</td>         
        <td>IV</td>         
        <td>VIII</td>           
        <td>-</td>          
        <td>IIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>0</td>          
        <td>II</td>         
        <td>-</td>          
        <td>OPb</td>            
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>
    </tr>
    <tr>            
        <td>3. 09:45:00 - 10:30:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>VIIB</td>           
        <td>-</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VI</td>         
        <td>0</td>          
        <td>IA</td>         
        <td>-</td>          
        <td>OPb</td>            
        <td>-</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>VIII</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>
    </tr>
    <tr>            
        <td>4. 10:40:00 - 11:25:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>VIII</td>           
        <td>-</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VIIB</td>           
        <td>0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>IA</td>         
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>IV</td>         
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>
    </tr>
    <tr>            
        <td>5. 11:45:00 - 12:30:00</td>         
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>VIII</td>           
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>0;OPa</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>VIIB</td>
    </tr>
    <tr>            
        <td>6. 12:45:00 - 13:30:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>-</td>          
        <td>VIII</td>           
        <td>-</td>          
        <td>OPb</td>            
        <td>-</td>          
        <td>-</td>          
        <td>OPa;0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>         
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>VIIB</td>
    </tr>
    <tr>            
        <td>7. 13:45:00 - 14:30:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>VI</td>         
        <td>V</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>VIII</td>
    </tr>
    <tr>            
        <td>8. 14:40:00 - 15:25:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>1. 07:55:00 - 08:40:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>VIIB</td>           
        <td>-</td>          
        <td>IIIB</td>           
        <td>IV</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>-</td>          
        <td>0</td>          
        <td>-</td>          
        <td>V</td>          
        <td>OPb</td>            
        <td>IA</td>         
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>2. 08:50:00 - 09:35:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>IV</td>         
        <td>-</td>          
        <td>IIIB</td>           
        <td>V</td>          
        <td>IA</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>II</td>         
        <td>-</td>          
        <td>-</td>          
        <td>0</td>          
        <td>IIIA</td>           
        <td>VIIA</td>           
        <td>OPb</td>            
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>3. 09:45:00 - 10:30:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>V</td>          
        <td>-</td>          
        <td>IIIB</td>           
        <td>VI</td>         
        <td>IA</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>0</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>OPb</td>            
        <td>II</td>         
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>4. 10:40:00 - 11:25:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>VIII</td>           
        <td>-</td>          
        <td>IIIB</td>           
        <td>VIIA</td>           
        <td>IA</td>         
        <td>-</td>          
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VI</td>         
        <td>0</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>OPb</td>            
        <td>-</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>5. 11:45:00 - 12:30:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>-</td>          
        <td>V</td>          
        <td>IIIB</td>           
        <td>VIIB</td>           
        <td>IA</td>         
        <td>-</td>          
        <td>VIII</td>           
        <td>ŚWIETLICA</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VIIA</td>           
        <td>0</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>OPb</td>            
        <td>-</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>6. 12:45:00 - 13:30:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IIIB</td>           
        <td>VIII</td>           
        <td>-</td>          
        <td>VIIA</td>           
        <td>V</td>          
        <td>ŚWIETLICA</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>7. 13:45:00 - 14:30:00</td>         
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>V</td>          
        <td>IV</td>         
        <td>IIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>8. 14:40:00 - 15:25:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA;VIIB</td>          
        <td>VI</td>         
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>1. 07:55:00 - 08:40:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>VIII</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IA</td>         
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>-</td>          
        <td>0</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>OPb</td>            
        <td>V</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IV</td>         
        <td>VI</td>         
        <td>-</td>          
        <td>VIIA</td>
    </tr>
    <tr>            
        <td>2. 08:50:00 - 09:35:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IA</td>         
        <td>IV</td>         
        <td>-</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VI</td>         
        <td>0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>IIIB</td>           
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>V</td>          
        <td>-</td>          
        <td>VIIA</td>
    </tr>
    <tr>            
        <td>3. 09:45:00 - 10:30:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>IV</td>         
        <td>-</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>IA</td>         
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>VIII</td>           
        <td>0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>-</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>VIIB</td>
    </tr>
    <tr>            
        <td>4. 10:40:00 - 11:25:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>-</td>          
        <td>V</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>IA</td>         
        <td>-</td>          
        <td>VIII</td>           
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>IV</td>         
        <td>0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>-</td>          
        <td>IB</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>VI</td>         
        <td>-</td>          
        <td>VIIB</td>
    </tr>
    <tr>            
        <td>5. 11:45:00 - 12:30:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>VIIA</td>           
        <td>-</td>          
        <td>IIIB</td>           
        <td>-</td>          
        <td>IA</td>         
        <td>VI</td>         
        <td>V</td>          
        <td>VIIB</td>           
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>IV</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>II</td>         
        <td>-</td>          
        <td>VIII</td>
    </tr>
    <tr>            
        <td>6. 12:45:00 - 13:30:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>IV</td>         
        <td>IIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>IIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>VIII</td>
    </tr>
    <tr>            
        <td>7. 13:45:00 - 14:30:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>IIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>8. 14:40:00 - 15:25:00</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>1. 07:55:00 - 08:40:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>-</td>          
        <td>-</td>          
        <td>IIIB</td>           
        <td>IV</td>         
        <td>IA</td>         
        <td>-</td>          
        <td>V</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>0</td>          
        <td>II</td>         
        <td>-</td>          
        <td>OPb</td>            
        <td>VI</td>         
        <td>IB</td>         
        <td>-</td>          
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIII</td>           
        <td>ŚWIETLICA</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>2. 08:55:00 - 09:35:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>-</td>          
        <td>-</td>          
        <td>IIIB</td>           
        <td>VIIA</td>           
        <td>IA</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>-</td>          
        <td>0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>IV</td>         
        <td>IB</td>         
        <td>-</td>          
        <td>VIIB</td>           
        <td>VIII</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>V</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>          
        <td>-</td>
    </tr>
    <tr>            
        <td>3. 09:45:00 - 10:30:00</td>         
        <td>-</td>          
        <td>OPa</td>            
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VIIB</td>           
        <td>IA</td>         
        <td>-</td>          
        <td>V</td>          
        <td>-</td>          
        <td>IIIA</td>           
        <td>II</td>         
        <td>-</td>          
        <td>IV</td>         
        <td>0</td>          
        <td>-</td>          
        <td>-</td>          
        <td>OPb</td>            
        <td>IIIB</td>           
        <td>IB</td>         
        <td>-</td>          
        <td>VIII</td>           
        <td>VIIA</td>           
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>-</td>          
        <td>VI</td>         
        <td>-</td>          
        <td>-</td>
    </tr>
    </table>
    </body>
    </html>

Answer 2

我添加了一个 javascript 方法 FitFontSize 来为不同的打印尺寸创建不同的布局。当 table 超过一页时，它将尝试自动减小字体大小，如果 table 适合打印纸的高度，它将保持默认字体大小。

    let papers = [
       {name:'a1', width:'84cm', height:'58cm', fontSize:20},
       {name:'a2', width:'59cm', height:'41cm', fontSize:18},
       {name:'a3', width:'42cm', height:'28cm', fontSize:16},
       {name:'a4', width:'27cm', height:'16cm', fontSize:14}
    ];
    // the fontSize is the default font size for diffrent paper size
    FitFontSize('t', papers);

这是完整的代码，a live demo

<!DOCTYPE html>
<html lang="pl-PL">
<head>
<title>Plan zajęć</title>

<style>
    table {
        table-layout:fixed;
        width:100%;
        height:100%;
    }

    @media screen {
        .sp-container {
            position:absolute;
            left:-99999px;
            top:-99999px;
        }
    }

    .sp-container-a4 .dayName {
        padding:0;
    }

    @media print {
        @page
        {
            size: landscape;
            padding: 0;
            margin:0.5em;
        }

        html, body {padding:0; margin:0; height:100vh; overflow:hidden;}
        .sp-container {display:none;}
        .sp-hide-on-print {display:none;}
    }

    @media print and (min-width: 10cm) {
        .sp-container-a1 {display:none;}
        .sp-container-a2 {display:none;}
        .sp-container-a3 {display:none;}
        .sp-container-a4 {display:block;}
    }

    @media print and (min-width: 30cm) {
        .sp-container-a1 {display:none;}
        .sp-container-a2 {display:none;}
        .sp-container-a3 {display:block;}
        .sp-container-a4 {display:none;}
    }

    @media print and (min-width: 50cm) {
        .sp-container-a1 {display:none;}
        .sp-container-a2 {display:block;}
        .sp-container-a3 {display:none;}
        .sp-container-a4 {display:none;}
    }

    @media print and (min-width: 80cm) {
        .sp-container-a1 {display:block;}
        .sp-container-a2 {display:none;}
        .sp-container-a3 {display:none;}
        .sp-container-a4 {display:none;}
    }

    table,
    th,
    td
    {
        border: 1px solid black;
        /*padding-left: 5px;
        padding-right: 5px;*/
    }

    tr td
    {
        border-right-style: solid;
        border-right-width: 1pt;
        border-bottom-style: solid;
        border-bottom-width: 1pt;
        /*padding-right: 5.4pt;
        padding-left: 5.65pt;*/
        text-align: center
    }

    .vert
    {
        writing-mode: vertical-lr;
    }

    .dayName
    {
        padding: 8px;
        text-align: center;
        font-weight: bold;
    }

    .rotate
    {
        transform: translateX(-30%) rotate(0.5turn);
    }

    .top_border
    {
        border-top: 3px solid black
    }
</style>

</head>
<body>
    <button class="sp-hide-on-print" onclick="changeRows(20);">20 rows</button>
    <button class="sp-hide-on-print" onclick="changeRows(50);">50 rows</button>

    <table id="t" style="border: 1pt solid #000000; border-collapse:collapse">
        <colgroup>
            <col style="width:11em;" />
        </colgroup>
        <tbody>
            <tr class="header_low_height">
                <th rowspan="2" style="">
                    <p><span>Kolejność godzin lekcyjnych</span></p>
                </th>
                <th colspan="31" style="">
                    <p><span>Nauczyciele <br> (przydział godzin lekcyjnych w klasach)</span></p>
                </th>
            </tr>
            <tr class="header_low_height">
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
                <td class="vert dayName">John Kovalsky</td>
            </tr>
        </tbody>
    </table>
</body>
<script>
function changeRows(num) {
    addRows(num);
    layoutForPrint();
}

function addRows(num) {
    var table = document.getElementById('t');
    var tbody = table.querySelector('tbody');
    tbody.querySelectorAll('tr.data').forEach((tr)=>tr.remove());
    for (let i=0; i<num; i++) {
        let tr = document.createElement('tr');
        tr.classList.add('data');
        let html = '';
        html += '<td>8. 14:40:00 - 15:25:00</td>';
        html += '<td>row' + (i+1) + '</td>';
        for (let j=0; j < 30; j++) {
            html += '<td>' + Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 3) + '</td>';
        }
        tr.innerHTML = html;
        tbody.appendChild(tr);
    }
}
// add test data
addRows(50);

function FitFontSize(id, papers) {
    function _resizeContent(el, paper) {
        let fontSize = paper.fontSize || 12;
        let container = document.createElement('div');
        container.classList.add(`sp-container`);
        container.classList.add(`sp-container-${paper.name}`);

        let css = 'box-sizing:border-box;';
        css += 'overflow-y:auto;';
        css += 'margin:0;padding:0;';
        css += `font-size:${fontSize}px;`;
        css += `width:${paper.width};height:${paper.height};`;
        container.setAttribute('style', css);
        container.innerHTML = el.outerHTML;

        document.body.appendChild(container);
        let tb = container.querySelector('table').classList.remove('sp-hide-on-print');
        container.querySelectorAll('[id]').forEach((el)=>el.removeAttribute('id'));

        // if the table overflowed try to reduce padding of td elements
        if (container.scrollHeight > container.clientHeight) {
            container.querySelectorAll('td').forEach(function(td) {
                td.style.padding = '0';
            });
        }
        // try to reduce the font size
        while (container.scrollHeight > container.clientHeight && fontSize > 5) {
            container.style.fontSize = `${--fontSize}px`;
            container.querySelector('col').style.width = fontSize * 30 / devicePixelRatio + 'px';
            container.querySelectorAll('td:not(.dayName)').forEach(function(td) {
                td.style.lineHeight = `${fontSize}px`;
            });
        }

        container.style.width = '100%';
        container.style.height = '100%';
        container.style.overflow = 'hidden';
    }

    document.querySelectorAll('.sp-container').forEach((c)=>c.remove());
    let el = document.getElementById(id);
    for (let paper of papers) {
        _resizeContent(el, paper);
    }
    el.classList.add('sp-hide-on-print');
}

function layoutForPrint() {
    let papers = [
       {name:'a1', width:'84cm', height:'58cm', fontSize:20},
       {name:'a2', width:'59cm', height:'41cm', fontSize:18},
       {name:'a3', width:'42cm', height:'28cm', fontSize:16},
       {name:'a4', width:'27cm', height:'16cm', fontSize:14}
    ]
    FitFontSize('t', papers);
}

layoutForPrint();
</script>
</html>

Answer 3

这是另一种可能的解决方案：

<script src="https://gist.github.com/jcollins-bioinfo/ee23a450529342a119ac3e4b12ed3c0a.js"></script>

HTML的源代码table:

运行上面的代码片段，或者直接从： https://gist.githubusercontent.com/jcollins-bioinfo/ee23a450529342a119ac3e4b12ed3c0a/raw/108fc18b1eb3ae55590dbf69c5741dce5caf0c5f/printing-dynamic-table-how-to-make-as-good-as-possible.html

打印

Table 使用显示的设置（自定义尺寸 ==）在 Google Chrome 中整齐地打印（无 headers/footers、最小边距、最大间距、A4 纸尺寸） 34%)

下面是我生成 HTML 文件的方式（使用 Python Jupyter Notebook）

运行笔记本单元格中的此代码，其中 pd.read_html 的输入 html 文件可以只是包含 <table>...</table> HTML 数据的文件:

import dash

from dash import html
from dash import dash_table
from jupyter_dash import JupyterDash

import pandas as pd

app = JupyterDash()

df2 = pd.read_html("name-of-html-file.html", header=[0, 2])[0] # just change this line, for input filename path

app.layout = html.Div([
    dash_table.DataTable(
        id='table',
        columns=[{
            "name": ["Kolejność godzin lekcyjnych"],
            "id": "main_h1"
        }] + [{
            "name": [x1, x2],
            "id": f"{x1}_{x2}"
        } for x1, x2 in df2.columns],
        data=[
            {
                **{
                    "main_h1": df2.index[n]
                },
                **{f"{x1}_{x2}": y
                   for (x1, x2), y in data},
            } for (n, data) in
            [*enumerate([list(x.items()) for x in df2.T.to_dict().values()])]
        ],
        merge_duplicate_headers=True,
    )
])

app.run_server(mode="inline")

然后，我使用 Chrome DevTools select 显示在笔记本中的 Dash 应用程序数据 table，select 仅 HTML table 标记元素，并将其复制到剪贴板：

最后，我只是将 html table 代码粘贴到您在问题中提供的 HTML 文档模板中（因此将您的特定样式代码保留在 <head>标签等）。并将其保存为 HTML 文件，在 Chrome 中打开该文件，然后按 cmd/ctrl-P 打开打印对话框，如上图所示。

打印动态table - 如何制作尽可能好

Printing dynamic table - how to make as good as possible

html

printing

HTML的源代码table:

打印

Table 使用显示的设置（自定义尺寸 ==）在 Google Chrome 中整齐地打印（无 headers/footers、最小边距、最大间距、A4 纸尺寸） 34%)

下面是我生成 HTML 文件的方式（使用 Python Jupyter Notebook）