如何使用 CSS 和 HTML 将页码添加到打印的网页中？

使用 CSS/HTML 在打印网页中实现页码

您遇到了一个有趣的要求：添加页眉、页脚和页面编号到打印的网站副本。本文探讨了可以帮助您实现这一目标的解决方案。

利用 CSS 和 HTML 进行页面编号

在 CSS 中，@page 规则提供了对页面格式的广泛控制，包括页码。通过在@bottom-right规则中定义一个计数器，您可以在每个打印页面上动态显示页码。

这是一个简单的代码片段：

@page {
  @bottom-right {
    content: counter(page) " of " counter(pages);
  }
}

此代码将放置页面每页右下角的数字，格式为“第 X 页，共 Y 页”。

浏览器支持

大多数现代浏览器都支持 CSS @page 规则。如果您需要支持较旧的浏览器，请考虑使用特定于浏览器的技术或第三方库。

进一步阅读

有关 CSS 和 HTML 中页面编号的更多信息，参考以下资源：

• [CSS3页面模块](http://www.w3.org/TR/css3-page/)
• [在 CSS 中使用 'page' 属性](http://www.intelligrape.com/blog/2010 /08/20/add-page-number-using-page-property-of-css/)
• [页码与PrinceXML](http://www.princexml.com/doc/6.0/page-numbers/)

实施这些解决方案将使您能够创建带有自定义页眉、页脚和页码，增强这些文档的可读性和专业性。

以上是如何使用 CSS 和 HTML 将页码添加到打印的网页中？的详细内容。更多信息请关注PHP中文网其他相关文章！