让 Chrome 浏览器在打印页面上重复表头

问题描述

我想要为每个打印页面重复我的表的标题，但似乎 Google Chrome 不支持该标签，有没有办法？我正在使用 Google Chrome v13.0.782.215 。

表格代码很简单… 没有什么花哨：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <style type="text/css" media="all">
           @page {
              size: landscape;
              margin-top: 0;
              margin-bottom: 1cm;
              margin-left: 0;
              margin-right: 0;
           }
           table {
               border: .02em solid #666; border-collapse:collapse; 
               width:100%; 
           }
           td, th {
               border: .02em solid #666; font-size:12px; line-height: 12px; 
               vertical-align:middle; padding:5px; font-family:"Arial";
           }
           th { text-align:left; font-size:12px; font-weight:bold; }
           h2 { margin-bottom: 0; }
       </style>
   </head>
   <body>
   <h2>Page Title</h2>
   <table>
       <thead>
           <tr class="row1">
               <th><strong>Heading 1</strong></th>
               <th><strong>Heading 2</strong></th>
               <th><strong>Heading 3</strong></th>
               <th><strong>Heading 4</strong></th>
               <th><strong>Heading 5</strong></th>
           </tr>
       </thead>
       <tbody>
           <tr class="row2">
              <td width="30">...</td>
              <td width="30">...</td>
              <td width="90">....</td>
              <td width="190">...</td>
              <td width="420">...</td>
           </tr>
           <tr class="row1">
              <td width="30">...</td>
              <td width="30">...</td>
              <td width="90">....</td>
              <td width="190">...</td>
              <td width="420">...</td>
           </tr>
           ....
       </tbody>
   </table>
   </body>
</html>

对此的任何见解都是值得欢迎的。

最佳解决方案

我相信这是 Chrome 中的 bug 。

次佳解决方案

更新 2017-03-22：重复表头已经在 Chrome 中实现！ (实际上，我认为这是在一段时间之前实施的) 。这意味着你可能不再需要这个解决方案了只需将列标题放在<thead> 标签中即可。只有在以下情况下才能使用以下解决方案：a) 在 Chrome 的实现中遇到 show-stopping 错误，b) 您需要”bonus features”，或 c) 您需要支持一些仍然不支持重复头文件的奇怪浏览器。

解决 (已过时)

下面的代码演示了我发现 multi-page 表打印的最佳方法。它具有以下特点：

列标题在每页上重复
无需担心纸张尺寸或多少行会适合 – 浏览器会自动处理所有内容
分页仅在行之间发生
单元格边框总是完全关闭
如果在表顶部附近发生分页符号，则不会遗漏隐藏的标题或列标题，而不附加任何数据 (问题不仅限于 Chrome)
在 Chrome 中使用！ (和其他 Webkit-based 浏览器，如 Safari 和 Opera)

… 以及以下已知的限制：

只支持 1 <thead>(这显然是你最 allowed to have 的)
不支持<tfoot>(虽然 Chrome-compatible 的运行脚注是 technically possible)
只支持 top-aligned <caption>
表不能有顶或底 margin; 在表格上方或下方添加空格，插入一个空的 div 并在其上设置一个底部边距
任何影响高度的 CSS 尺寸值 (包括 border-width 和 line-height) 必须在 px
无法通过将宽度值应用于单个表格单元格来设置列宽度; 您应该让单元格内容自动确定列宽，或者使用<col>s 根据需要设置特定的宽度
在运行 JS 后，表不能 (轻松) 动态更改

代码

<!DOCTYPE html>
<html>
  <body>
    <table class="print t1"> <!-- Delete "t1" class to remove row numbers. -->
      <caption>Print-Friendly Table</caption>
      <thead>
        <tr>
          <th></th>
          <th>Column Header</th>
          <th>Column Header</th>
          <th>Multi-Line<br/>Column<br/>Header</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td></td>
          <td>data</td>
          <td>Multiple<br/>lines of<br/>data</td>
          <td>data</td>
        </tr>
      </tbody>
    </table>
  </body>
</html>

<style>
  /* THE FOLLOWING CSS IS REQUIRED AND SHOULD NOT BE MODIFIED. */
    div.fauxRow {
      display: inline-block;
      vertical-align: top;
      width: 100%;
      page-break-inside: avoid;
    }
    table.fauxRow {border-spacing: 0;}
    table.fauxRow > tbody > tr > td {
      padding: 0;
      overflow: hidden;
    }
    table.fauxRow > tbody > tr > td > table.print {
      display: inline-table;
      vertical-align: top;
    }
    table.fauxRow > tbody > tr > td > table.print > caption {caption-side: top;}
    .noBreak {
      float: right;
      width: 100%;
      visibility: hidden;
    }
    .noBreak:before, .noBreak:after {
      display: block;
      content: "";
    }
    .noBreak:after {margin-top: -594mm;}
    .noBreak > div {
      display: inline-block;
      vertical-align: top;
      width:100%;
      page-break-inside: avoid;
    }
    table.print > tbody > tr {page-break-inside: avoid;}
    table.print > tbody > .metricsRow > td {border-top: none !important;}

  /* THE FOLLOWING CSS IS REQUIRED, but the values may be adjusted. */
    /* NOTE: All size values that can affect an element's height should use the px unit! */
    table.fauxRow, table.print {
      font-size: 16px;
      line-height: 20px;
    }

  /* THE FOLLOWING CSS IS OPTIONAL. */
    body {counter-reset: t1;} /* Delete to remove row numbers. */
    .noBreak .t1 > tbody > tr > :first-child:before {counter-increment: none;} /* Delete to remove row numbers. */
    .t1 > tbody > tr > :first-child:before { /* Delete to remove row numbers. */
      display: block;
      text-align: right;
      counter-increment: t1 1;
      content: counter(t1);
    }
    table.fauxRow, table.print {
      font-family: Tahoma, Verdana, Georgia; /* Try to use fonts that don't get bigger when printed. */
      margin: 0 auto 0 auto; /* Delete if you don't want table to be centered. */
    }
    table.print {border-spacing: 0;}
    table.print > * > tr > * {
      border-right: 2px solid black;
      border-bottom: 2px solid black;
      padding: 0 5px 0 5px;
    }
    table.print > * > :first-child > * {border-top: 2px solid black;}
    table.print > thead ~ * > :first-child > *, table.print > tbody ~ * > :first-child > * {border-top: none;}
    table.print > * > tr > :first-child {border-left: 2px solid black;}
    table.print > thead {vertical-align: bottom;}
    table.print > thead > .borderRow > th {border-bottom: none;}
    table.print > tbody {vertical-align: top;}
    table.print > caption {font-weight: bold;}
</style>

<script>
  (function() { // THIS FUNCTION IS NOT REQUIRED. It just adds table rows for testing purposes.
    var rowCount = 100
      , tbod = document.querySelector("table.print > tbody")
      , row = tbod.rows[0];
    for(; --rowCount; tbod.appendChild(row.cloneNode(true)));
  })();

  (function() { // THIS FUNCTION IS REQUIRED.
    if(/Firefox|MSIE |Trident/i.test(navigator.userAgent))
      var formatForPrint = function(table) {
        var noBreak = document.createElement("div")
          , noBreakTable = noBreak.appendChild(document.createElement("div")).appendChild(table.cloneNode())
          , tableParent = table.parentNode
          , tableParts = table.children
          , partCount = tableParts.length
          , partNum = 0
          , cell = table.querySelector("tbody > tr > td");
        noBreak.className = "noBreak";
        for(; partNum < partCount; partNum++) {
          if(!/tbody/i.test(tableParts[partNum].tagName))
            noBreakTable.appendChild(tableParts[partNum].cloneNode(true));
        }
        if(cell) {
          noBreakTable.appendChild(cell.parentNode.parentNode.cloneNode()).appendChild(cell.parentNode.cloneNode(true));
          if(!table.tHead) {
            var borderRow = document.createElement("tr");
            borderRow.appendChild(document.createElement("th")).colSpan="1000";
            borderRow.className = "borderRow";
            table.insertBefore(document.createElement("thead"), table.tBodies[0]).appendChild(borderRow);
          }
        }
        tableParent.insertBefore(document.createElement("div"), table).style.paddingTop = ".009px";
        tableParent.insertBefore(noBreak, table);
      };
    else
      var formatForPrint = function(table) {
        var tableParent = table.parentNode
          , cell = table.querySelector("tbody > tr > td");
        if(cell) {
          var topFauxRow = document.createElement("table")
            , fauxRowTable = topFauxRow.insertRow(0).insertCell(0).appendChild(table.cloneNode())
            , colgroup = fauxRowTable.appendChild(document.createElement("colgroup"))
            , headerHider = document.createElement("div")
            , metricsRow = document.createElement("tr")
            , cells = cell.parentNode.cells
            , cellNum = cells.length
            , colCount = 0
            , tbods = table.tBodies
            , tbodCount = tbods.length
            , tbodNum = 0
            , tbod = tbods[0];
          for(; cellNum--; colCount += cells[cellNum].colSpan);
          for(cellNum = colCount; cellNum--; metricsRow.appendChild(document.createElement("td")).style.padding = 0);
          cells = metricsRow.cells;
          tbod.insertBefore(metricsRow, tbod.firstChild);
          for(; ++cellNum < colCount; colgroup.appendChild(document.createElement("col")).style.width = cells[cellNum].offsetWidth + "px");
          var borderWidth = metricsRow.offsetHeight;
          metricsRow.className = "metricsRow";
          borderWidth -= metricsRow.offsetHeight;
          tbod.removeChild(metricsRow);
          tableParent.insertBefore(topFauxRow, table).className = "fauxRow";
          if(table.tHead)
            fauxRowTable.appendChild(table.tHead);
          var fauxRow = topFauxRow.cloneNode(true)
            , fauxRowCell = fauxRow.rows[0].cells[0];
          fauxRowCell.insertBefore(headerHider, fauxRowCell.firstChild).style.marginBottom = -fauxRowTable.offsetHeight - borderWidth + "px";
          if(table.caption)
            fauxRowTable.insertBefore(table.caption, fauxRowTable.firstChild);
          if(tbod.rows[0])
            fauxRowTable.appendChild(tbod.cloneNode()).appendChild(tbod.rows[0]);
          for(; tbodNum < tbodCount; tbodNum++) {
            tbod = tbods[tbodNum];
            rows = tbod.rows;
            for(; rows[0]; tableParent.insertBefore(fauxRow.cloneNode(true), table).rows[0].cells[0].children[1].appendChild(tbod.cloneNode()).appendChild(rows[0]));
          }
          tableParent.removeChild(table);
        }
        else
          tableParent.insertBefore(document.createElement("div"), table).appendChild(table).parentNode.className="fauxRow";
      };
    var tables = document.body.querySelectorAll("table.print")
      , tableNum = tables.length;
    for(; tableNum--; formatForPrint(tables[tableNum]));
  })();
</script>

它如何工作 (如果您不在乎，请不要再进一步了解，您需要的一切都在上面。)

Per @ Kingsolmn 的请求，下面是这个解决方案如何工作的解释。它不涵盖 JavaScript，这不是严格要求的 (尽管它确实使得这种技术更容易使用) 。相反，它专注于生成的 HTML 结构和相关联的 CSS，这是真正的魔法发生的地方。

这是我们将要使用的表格：



<table>
  <tr><th>ColumnA</th><th>ColumnB</th></tr>
  <tr><td>row1</td><td>row1</td></tr>
  <tr><td>row2</td><td>row2</td></tr>
  <tr><td>row3</td><td>row3</td></tr>
</table>

(为了节省空间，我给它只有 3 个数据行; 显然，一个多页表通常会有更多)

我们需要做的第一件事是将表分成一系列较小的表，每个表都有自己的列标题副本。我称这些较小的表为 fauxRows 。



<table> <!-- fauxRow -->
  <tr><th>ColumnA</th><th>ColumnB</th></tr>
  <tr><td>row1</td><td>row1</td></tr>
</table>

<table> <!-- fauxRow -->
  <tr><th>ColumnA</th><th>ColumnB</th></tr>
  <tr><td>row2</td><td>row2</td></tr>
</table>

<table> <!-- fauxRow -->
  <tr><th>ColumnA</th><th>ColumnB</th></tr>
  <tr><td>row3</td><td>row3</td></tr>
</table>

fauxRows 基本上是原始表的克隆，但只有一个数据行。 (如果你的表格有标题，那么只有顶级的 fauxRow 应该包括它)

接下来，我们需要使 fauxRows 不可破坏。这意味着什么？ (注意 – 这可能是分页处理中最重要的概念。)”Unbreakable” 是用于描述不能在两个页面之间分割的内容块的术语。当在这样的块所占用的空间内发生分页时，整个块移动到下一页。 (请注意，我在这里非正式地使用了这个词”block”; 我不是专门指 block level elements) 。这个行为有一个有趣的 side-effect，我们将在以后使用：它可以暴露最初由于分层隐藏的内容或溢出。

我们可以通过应用以下任一 CSS 声明来使 fauxRows 不可破坏：

page-break-inside: avoid;
display: inline-table;

我通常使用这两个，因为第一个是为了这个目的，第二个工作在旧/不兼容的浏览器。在这种情况下，为了简单起见，我将坚持使用 page-break 属性。请注意，添加此属性后，您将看不到表的外观上的任何更改。



<table style="page-break-inside: avoid;"> <!-- fauxRow -->
      <tr><th>ColumnA</th><th>ColumnB</th></tr>
      <tr><td>row1</td><td>row1</td></tr>
    </table>
    
    <table style="page-break-inside: avoid;"> <!-- fauxRow -->
      <tr><th>ColumnA</th><th>ColumnB</th></tr>
      <tr><td>row2</td><td>row2</td></tr>
    </table>
    
    <table style="page-break-inside: avoid;"> <!-- fauxRow -->
      <tr><th>ColumnA</th><th>ColumnB</th></tr>
      <tr><td>row3</td><td>row3</td></tr>
    </table>

现在 fauxRows 是不可破坏的，如果在数据行中发生分页符号，它将随着其附加的标题行一起移动到下一页。所以下一页将始终包含顶部的列标题，这是我们的目标。但是表格看起来很奇怪，现在所有额外的标题行。为了使它看起来像一个正常的表，我们需要隐藏额外的标题，只有在需要的时候才会出现。

我们要做的是将每个 fauxRow 放在带有 overflow: hidden; 的容器元素中，然后将其向上移动，以使头部被容器顶部剪切。这也将使数据行一起移回，使它们显示为连续的。

您的第一本能可能是使用容器的 div，但我们将使用父表格的单元格。我会解释为什么以后，但现在，我们只需要添加代码。 (再次，这不会影响表的外观。)



table {
  border-spacing: 0;
  line-height: 20px;
}
th, td {
  padding-top: 0;
  padding-bottom: 0;
}
<table> <!-- parent table -->
  <tr>
    <td style="overflow: hidden;">

      <table style="page-break-inside: avoid;"> <!-- fauxRow -->
        <tr><th>ColumnA</th><th>ColumnB</th></tr>
        <tr><td>row1</td><td>row1</td></tr>
      </table>

    </td>
  </tr>
  <tr>
    <td style="overflow: hidden;">

      <table style="page-break-inside: avoid;"> <!-- fauxRow -->
        <tr><th>ColumnA</th><th>ColumnB</th></tr>
        <tr><td>row2</td><td>row2</td></tr>
      </table>

    </td>
  </tr>
  <tr>
    <td style="overflow: hidden;">

      <table style="page-break-inside: avoid;"> <!-- fauxRow -->
        <tr><th>ColumnA</th><th>ColumnB</th></tr>
        <tr><td>row3</td><td>row3</td></tr>
      </table>

    </td>
  </tr>
</table>

请注意表格上方的 CSS 。我添加它有两个原因：首先，它阻止父表在 fauxRows 之间添加空格; 第二，它使头部高度可预测，这是必要的，因为我们不使用 JavaScript 动态计算。

现在我们只需要将 fauxRows 向上移动，我们将使用负边距。但它并不像你想象的那么简单。如果我们直接在 fauxRow 中添加了一个负边距，那么当 fauxRow 被碰到下一页时，它将保持有效，导致页眉被页面顶部剪切。我们需要一种方式来留下负利润。

为了完成这个，我们将在第一个之后的每个 fauxRow 之上插入一个空的 div，并向其添加负边距。 (第一个 fauxRow 被跳过，因为它的头部应该始终是可见的。) 由于边距在一个单独的元素上，它不会跟随到下一个页面的 fauxRow，并且标题不会被剪切。我称这些空的 divs headerHiders 。



table {
  border-spacing: 0;
  line-height: 20px;
}
th, td {
  padding-top: 0;
  padding-bottom: 0;
}
<table> <!-- parent table -->
  <tr>
    <td style="overflow: hidden;">

      <table style="page-break-inside: avoid;"> <!-- fauxRow -->
        <tr><th>ColumnA</th><th>ColumnB</th></tr>
        <tr><td>row1</td><td>row1</td></tr>
      </table>

    </td>
  </tr>
  <tr>
    <td style="overflow: hidden;">

      <div style="margin-bottom: -20px;"></div> <!-- headerHider -->

      <table style="page-break-inside: avoid;"> <!-- fauxRow -->
        <tr><th>ColumnA</th><th>ColumnB</th></tr>
        <tr><td>row2</td><td>row2</td></tr>
      </table>

    </td>
  </tr>
  <tr>
    <td style="overflow: hidden;">

      <div style="margin-bottom: -20px;"></div> <!-- headerHider -->

      <table style="page-break-inside: avoid;"> <!-- fauxRow -->
        <tr><th>ColumnA</th><th>ColumnB</th></tr>
        <tr><td>row3</td><td>row3</td></tr>
      </table>

    </td>
  </tr>
</table>

就这样，我们完成了！在屏幕上，表格现在看起来很正常，顶部只有一列列标题。在打印中，它现在应该有运行标题。

如果您想知道为什么我们使用父表而不是一堆容器 div，这是因为 Chrome /webkit 有一个错误，导致 div-enclosed 不可破坏的块将其容器运载到下一页。由于 headerHider 也在容器中，所以它不会像它应该被遗弃，这导致剪辑头。该错误仅在不可破坏的块是具有 non-zero 高度的 div 中的最高元素时发生。

在编写本教程时，我发现了一个解决方法：您只需要在 headerHider 上显式设置 height: 0;，并为其添加一个空值为 1 的 non-zero 高度的子 div 。那么你可以使用一个 div 容器。然而，我仍然喜欢使用父表，因为它已经被更彻底地测试，并且在某种程度上通过将 fauxRows 回到一个表中来挽回语义。

编辑：我刚刚意识到，JavaScript-generated 标记稍有不同，它将每个 fauxRow 放在一个单独的容器表中，并将”fauxRow” className 分配给它 (容器) 。这将是页脚支持所必需的，我打算添加一天，但从未做过。如果我要更新 JS，我可能会考虑切换到 div 容器，因为我使用表的语义合理性不适用。

*有两种情况，一种不可破坏的块可以在两个页面之间分割：当它超过可打印区域的高度时。你应该尽量避免这种情况; 您本质上要求浏览器做出不可能的事情，它可以对输出产生一些非常奇怪的影响。

第三种解决方案

现在可以使用 jQuery …. 使用 chrome 进行打印。请尝试使用此代码 (我很遗憾，在我修改之前，忘记了谁是这段代码的创建者，而我的英文语言不好：D hehehe)

            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
            <html>
            <head>
                <title>DOCUMENT TITLE</title>
                <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.css"/>
                <style type="text/css">
                    @media print{
                        table { page-break-after:auto;}
                        tr    { page-break-inside:avoid;}
                        td    { page-break-inside:auto;}
                        thead { display:table-header-group }

                        .row-fluid [class*="span"] {
                          min-height: 20px;
                        }
                    }

                    @page { 
                        margin-top: 1cm;
                        margin-right: 1cm;
                        margin-bottom:2cm;
                        margin-left: 2cm;';
                        size:portrait;
                        /*
                        size:landscape;
                        -webkit-transform: rotate(-90deg); -moz-transform:rotate(-90deg);
                        filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
                        */

                    };
                </style>
            </head>
            <body>
                <div id="print-header-wrapper">
                    <div class="row-fluid">HEADER TITLE 1</div>
                    <div class="row-fluid">HEADER TITLE 2</div>
                </div>
                <div class="row-fluid" id="print-body-wrapper">
                    <table class="table" id="table_data">
                        <thead>
                            <tr><th>TH 1</th><th>TH 2</th></tr>
                        </thead>
                        <tbody>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                            <tr><td>TD 1</td><td>TD 2</td></tr>
                        </tbody>
                    </table>
                    <div id="lastDataTable"></div>
                </div>
                <script type="text/javascript">
                    jQuery(document).ready(function()
                    {
                        var printHeader = $('#print-header-wrapper').html();
                        var div_pageBreaker = '<div style="page-break-before:always;"></div>';
                        var per_page = 25;
                        $('#table_data').each(function(index, element)
                        {
                            //how many pages of rows have we got?
                            var pages = Math.ceil($('tbody tr').length / per_page);

                            //if we only have one page no more
                            if (pages == 1) {
                                return;
                            }
                            //get the table we're splutting
                            var table_to_split = $(element);

                            var current_page   = 1;
                            //loop through each of our pages
                            for (current_page = 1; current_page <= pages; current_page++) 
                            {
                                //make a new copy of the table
                                var cloned_table = table_to_split.clone();
                                //remove rows on later pages
                                $('tbody tr', table_to_split).each(function(loop, row_element) {
                                    //if we've reached our max
                                    if (loop >= per_page) {
                                        //get rid of the row
                                        $(row_element).remove();
                                    }
                                });

                                //loop through the other copy
                                $('tbody tr', cloned_table).each(function(loop, row_element) {
                                    //if we are before our current page
                                    if (loop < per_page) {
                                        //remove that one
                                        $(row_element).remove();
                                    }
                                });

                                //insert the other table afdter the copy
                                if (current_page < pages) {
                                    $(div_pageBreaker).appendTo('#lastDataTable');
                                    $(printHeader).appendTo('#lastDataTable');
                                    $(cloned_table).appendTo('#lastDataTable');
                                }

                                //make a break
                                table_to_split = cloned_table;
                            }
                        });
                    });
                </script>
              </body>
            </html>

第四种方案

这是一个在 Webkit，Blink 和 Vivliostyle 中不可用的增强功能，而不是其他更多的「面向打印的格式化程序」(Firefox，IE) 。

您可以查看 issue for Google Chrome since version 4 here (6 years and 45 versions ago!)，在这里我们可以感受到它最近有一个拥有者 (2016 年 2 月)，甚至似乎在努力。

有人说 has been also held in the W3，我们可以感谢它的用处：

Since repeating table headers and footers on a fragmentation break is generally a useful thing, I suggest we make a normative requirement and say that UAs must repeat header/footer rows when a table spans a break.

同时，@DoctorDestructo 和 @thefredzx 的 JS 和 Jquery 代码对我的用户来说非常有用，因为用户不使用 Firefox 或 IE(大多数) 。

第一个需要注意的新版本，包括这个功能，应该注意到这里，我们许多人会很感激。

参考文献

Having Google Chrome repeat table headers on printed pages

注：本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意，可以加入我们改善翻译效果：薇晓朵技术论坛。

让 Chrome 浏览器在打印页面上重复表头