关于制作像素完美的 CSS 布局的建议？
一个业务目标要求我在屏幕上制作一个像素完美的表单。如果用户打印此表格，它将与美国政府印刷局版本的表格完全匹配；打印机将生成该文档的（合理的）可扫描副本。之前的解决方案是PDF，它只对我们有用。
我倾向于 HTML/CSS，并且希望获得有关工具的建议来帮助实现这一点。
对于工具，Firefox 中的 PixelPerfect 似乎是一个好的开始。如果有帮助的话，目标平台是（击鼓）IE6。该文档类似于此。
如果 HTML/CSS 完全不行，那么 Adobe Flex 是我的下一个选择。
One business goal requires that I make a form on screen that's pixel-perfect. If a user prints this form, it will exactly match the US Government Printing Office version of the form; the printer will produce a (reasonably) scannable copy of this document. The previous solution is PDF, which will only work to a certain point for us.
I'm leaning towards HTML/CSS, and would like suggestions on tools to assist that.
For tools, PixelPerfect in Firefox seems a good start. The target platform for this is (drum roll) IE6, if it helps. The document looks like this.
If HTML/CSS is a complete no-go, Adobe Flex is my next choice.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
如果像素完美打印是目标，而 PDF 也无法实现这一目标，那么您几乎可以立即放弃从浏览器进行打印。在客户端渲染时存在太多变量：从不同的浏览器（IE6？祝你好运！）到不同的字体，到用户设置，到 A4 与 Letter 尺寸的纸张。
请问为什么PDF不适合？
If pixel perfect printing is the goal, and not even PDF will get you there, you can pretty much give up straight away on printing from the browser. There are waaaay too many variables when rendering on the client side: from different browsers (IE6? Good luck!) to different fonts, to user settings, to A4 vs Letter size paper.
Could I ask why PDF doesn't suit?
我同意使用 html/css 很难实现像素完美的布局，尤其是表单。但是，我认为 pdf 可以接收来自外部网络表单的输入，或者具有填写后将打印的文本字段。
Flex 输出到 pdf 将是一个好主意，但我不认为使用 flex 作为渲染引擎对此有太大帮助。
另一种选择是制作 pdf 并使用服务器端语言使用先前 Web 表单中的字段对其进行自定义，然后输出结果。 （可以使用 ruby/django/php 轻松完成，有一些很好的 pdf 库。）
I agree that pixel-perfect layouts are very, very hard to achieve with html/css, particularly with forms. However, I think pdfs can recieve input from external web forms, or have textfields that when filled out will print.
Flex outputting to pdf would be a good idea, but I don't think using flex as an rendering engine will help too much with this.
Another option would be to make the pdf and use a server-side langage to customize it with fields from a prior webform, and output the result. (Can easily be done with ruby/django/php, there are some good pdf libraries out there.)
首先，放弃像素。您正在寻找的是打印样式表，其中使用物理单位（厘米/英寸）、字体大小（以磅为单位）等指定了所有内容。屏幕上显示的内容、字体大小以及是否是像素完美或not 似乎与您生成可扫描副本的要求无关。
现在的问题是，IE6 对物理单位和打印样式表的支持是否足够完整？鉴于我为客户制作打印样式表的经验，如果您看错了，IE 就会在打印过程中崩溃，我想说不太可能 - 考虑到您正在处理的表单的复杂性。
First, abandon pixels. What you're looking for is a print stylesheet, with everything specified using physical units (cm/inches), font size in pt, etc. What is displayed on the screen, in what font size, and whether it is pixel-perfect or not doesn't seem relevant to your requirement of producing a scannable copy.
The question is now, is IE6 support for physical units and print stylesheets complete enough for that? Given my experience with making print stylesheets for clients, where IE would simply crash during the print process if you looked at it wrong, I'd say not too likely -- not with the complexity of the forms you're dealing with.
如果您担心渲染器（IE、Acrobat 等）出现问题，您始终可以在服务器上渲染表单，然后只向用户提供图像。
If you're worried about the renderer (IE, Acrobat, etc.) screwing up, you could always render the form on the server, and just serve an image to the user.
Dean，看看Prince。 Bert Bos 和 Håkon Wium Lie 使用它来制作 他们关于 CSS 的书。他们在 A List Apart 文章 中对此进行了一些解释。
Dean, check out Prince. Bert Bos and Håkon Wium Lie used it for production of their book on CSS. They explain a bit about it in an A List Apart article.