问题标签 [css-paged-media]

我想选择打印页面上的最后一个元素。例如，给定这个 HTML（假设打印页面的高度为 100px）：

这个CSS：

我希望能够选择每个打印页面上的最后一个元素，在这种情况下#c（并且#e，虽然如果有必要，这可以很容易地用 排除:not(:last-child)）并删除它的边框。

所需输出的近似值：

目前我正在使用 Prince XML。我不喜欢用它来处理 JavaScript。

可能吗？

我已按照本文中的步骤安排我的页面进行打印。然而，似乎只有几件事真正起作用。我无法让选择器@top-center在 Chrome、Firefox 或 Opera 中工作，尽管caniuse说它应该在大多数主要浏览器中工作。

这是否已被悄悄放弃或弃用？

我很确定它是正确的，但无论如何我都会在这里发布我的 CSS 以供参考：

内容不会出现在任何地方。

我有一个元素列表（任意长度）。但是，当用户打印它时，我想更改每一页上最后一个元素的样式。

到目前为止，我尝试使用@page {.el:last-child...}，但什么也没做。并且 usingel:last-child仅将样式应用于最后一页上的最后一个孩子。

任何帮助表示赞赏。

我有以下 HTML：

谷歌、@Page文档和这个链接都没有这方面的任何信息。

我有以下代码在我从 html 生成的 pdf 页面右侧的页脚中显示页码：

这愉快地打印了Page A of X。我如何设置 A 和 X 的样式？

有没有一种方法可以定义一次并在多个内容属性中引用它，而不是多次使用相同的 base64 数据？

我不能使用类，因为我需要能够将它与 css 分页媒体选择器一起使用：

我也不能使用 javascript，因为 CSS 不是由浏览器呈现，而是由 CSS 分页媒体处理器（Prince XML）呈现。

I am generating PDF document using FlyingSaucer with page numbers in running header. What I am trying to achieve is to be able to change style of counter applied to running element used for header.

Since the CSS is applied by FlyingSaucer I cannot use javascript.

Example html:

css:

This piece of css correctly applies headers to the whole document after

is placed.

I am trying to start my document with above page styling ( lower-roman ) and after specific place in my document - let's say I would like to either change content of right-header or replace @page content with different running element for the rest of the document with styling set to decimal numbers.

I know that FlyingSaucer has limited CSS3 support but I cannot find any solution ( not restricted to only FlyingSaucer) for such problem.

Content of running header can be changed without effect on previous headers as FlyingSaucer allows to reset the counter at any point of the document using css rule.

and change is visible only after that point.

So my current status is that I have pages numbered with lower-roman i-iv ( for title page, TOC etc. ) and then reset back to i and increment till the end of document. All I need to do is to change

to

or switch displayed running element to the new one.

Another solution I have tried which adds another possibility to solve this problem:

with this code I think the solution would be to enable #forcontent and disable #before at the beginning of #content. I have tried working with ~ selector but it doesn't work for changing preceding elements.

Does anybody know how this could be achieved or could point me to different solutions I could try?

我正在使用 PDFReactor 生成 pdf。<a>使用 @top-left 和 @top-right 使用复杂的 html 标签（如tag 而不是简单的原始文本）来构造 pdf 顶部的最佳方法是什么@top-right{content: "some text"}？

我正在使用 CSS Paged Media 创建 PDF。我的大部分内容都正常对齐，但我有几段我想给负缩进：它们应该从其他所有内容左侧 2.5 毫米开始。

到目前为止，这是我的 CSS：

这是预期的效果：

当我在 Antennahouse (6.5) 中尝试上述操作时，红色背景块的左边缘仍然与文本“此服务手册...”的左边缘对齐

所以text-indent: -2.5mm;似乎没有像我预期的那样工作。怎样才能达到我想要的效果？

我想打印一个 HTML 页面并对我得到的打印布局进行更多控制，所以我首先将 @page 设置为特定大小（在我的情况下为 A4 肖像），现在我需要检查我拥有的一些动态内容是否可以适合该页面还是我必须在几个地方手动拆分它。

我遇到的主要问题是如何获取打印页面的高度/宽度尺寸。

我尝试设置一个宽度和高度为 100% 的 div 并获得它的高度，但它给了我一个错误的结果。为了便于测试，您可以使用：https ://playground.jsreport.net/w/anon/KpNomfIu （它是一个打印到 PDF 的库，基本上只使用 chrome 打印并显示 pdf）。

无论我使用 A3、A4 还是 A1，我的高度总是 600 像素，所以很明显这是错误的。

这只需要在 Chrome 上工作。（我知道这很奇怪，但我需要一个使用 CSS3 Paged Media 和所有相关内容无法实现的布局）

我有一个由步骤组成的程序。一些步骤附有图像。

和我的 CSS：

这是默认输出。图像不会与它们所属的步骤保持一致，步骤 2 的文本放在图像 1 旁边：

我希望属于第 2 步的图像与第 2 步垂直对齐：

过去，我在 XSL-FO 中通过在每个浮动图像之前插入一个高度 = 0 的全宽块来实现我想要的结果。

我可以使用 CSS 命令实现我想要的布局吗？或者在将 CSS 应用于 HTML 之前，我是否需要在 HTML 中插入一个块？