CSS分页媒体：最后一页选择器答案

【问题标题】：CSS paged media :last page selectorCSS分页媒体：最后一页选择器
【发布时间】：2017-06-27 10:35:06
【问题描述】：

我需要知道是否可以使用:last 选择器修改最后一页的内容。

我不确定它是否存在，我看到它在其他 stackoverflow 答案中使用，如下所示：Footer on last printed page。但我在documentation 中找不到它，我尝试使用它时它不起作用。

我正在尝试清除上一页页脚的内容，如下所示：

@page {
        @bottom-right {
            content: "Please turn over";
        }
}

@page :last {
        @bottom-right {
            content: none;
        }
}

当我将它与:firstselector 一起使用时，它可以工作。怎样才能得到最后一页的效果？

我正在使用 Weasyprint 打印 PDF 文件。

【问题讨论】：

这似乎很奇怪，他们做了一个left、right、first，却没有last。

标签： css css-paged-media

【解决方案1】：

这可以使用named pages来实现。

在最后一页上创建一个元素（或使用将出现在最后一页上的现有元素）并为其分配一个last-page 类。

下面的例子：

HTML

<div class="last-page"></div> <!-- Or add this class to an existing element that appears on the last page -->

CSS

.last-page {
    page: last_page;
    page-break-before: always; /* Use if your last page is blank, else omit. */
}

@page {
   @bottom-right {
       content: "Please turn over";
    }
}

@page last_page {
    @bottom-right {
        content: none;
    }
}

用 Weasyprint 测试 - 很有魅力。

【讨论】：

这似乎是合理的，但是当您尝试在 Chrome 浏览器上打印页面时，这似乎不起作用。

【解决方案2】：

基于the CSS3 Page docs，:last 伪类似乎已被删除（或从未包含）。

如果您可以在文档末尾强制分页，则可以使用 :blank 伪类定位最后一页。不过，这可能会对其他空白页产生不良影响。

【讨论】：

感谢您解决这个问题。我也想过使用:blank 作为一个选项。
尝试考虑其他一些选项 - 例如:right + :not(:left)，但这需要测试以查看它是否有效。
这有点道理。显然，PDF 打印机知道文档的开始位置和当前位置。最后一页取决于它之前的所有内容，除非手动明确设置。我不知道设置“文档在此处结束”的方法，但我想任何尝试的软件都应该首先渲染整个文档以确定最后一页，然后检索并重新设置该页面的样式以实现此目的。
@G_V 因此，当您在每页上打印页数时，它不会混淆驱动程序，但是当您需要设置最后一页的属性时 - 它会混淆。很棒。