如何在分页后看到第n个孩子的背景色？

Question

我正在创建打印页，我需要避免表格破裂。这就是为什么在表中断时会创建一个新页面的原因。然而，在分页后，我看不到第n个子代的背景色。

避免表格中断：

table {
     page-break-inside: avoid;
     break-inside: avoid;
}

对于第n个孩子，我尝试了这个：

tbody tr:nth-child(odd) {
    background: rgb(235,237,237);
}

分页后，我希望看到背景颜色，但不知何故看不到这些。

Answer 1

如果仅在打印过程中发生这种情况，则可能需要添加精确的打印颜色调整属性，因为默认情况下会忽略颜色。

@media print{
    body{
        -webkit-print-color-adjust: exact;
    }
}

我复制了你的问题，在应用该设置后，它为我修复了它，所以我希望这对我有帮助。还要记住，如果有一个背景颜色设置为任何背景颜色，它将隐藏<tr>背景颜色。

编辑将z-index:-1和position: relative添加到第二个页面修复了此问题。

<page class="second-page">

.second-page{
    position: relative;
    z-index: -1;
    }