建议像素完美的CSS布局?

时间:2009-10-27 13:26:18

标签: html css pixel-perfect form-layout

一个业务目标要求我在屏幕上制作一个像素完美的表单。如果用户打印此表单,它将与表单的美国政府印刷局版本完全匹配;打印机将生成该文档的(合理)可扫描副本。以前的解决方案是PDF,它只对我们有用。

我倾向于使用HTML / CSS,并希望获得有关工具的建议以提供帮助。

对于工具,Firefox中的PixelPerfect似乎是一个良好的开端。目标平台是(鼓)IE6,如果有帮助的话。该文档看起来像this

如果HTML / CSS完全禁止,Adobe Flex是我的下一个选择。

5 个答案:

答案 0 :(得分:6)

如果像素完美打印是目标,甚至PDF都不会让你到那里,你几乎可以立即放弃从浏览器打印。在客户端渲染时有太多变量:从不同的浏览器(IE6?祝你好运!)到不同的字体,用户设置,A4和Letter尺寸的纸张。

我可以问为什么PDF不合适吗?

答案 1 :(得分:1)

我同意使用html / css非常非常难以实现像素完美的布局,特别是对于表单。但是,我认为pdf可以从外部Web表单接收输入,或者填写时会打印出文本字段。

Flex输出到pdf会是一个好主意,但我不认为使用flex作为渲染引擎会对此有太多帮助。

另一种选择是制作pdf并使用服务器端语言来使用先前webform中的字段对其进行自定义,然后输出结果。 (可以很容易地用ruby / django / php完成,那里有一些很好的pdf库。)

答案 2 :(得分:1)

首先,放弃像素。您正在寻找的是打印样式表,其中所有内容都使用物理单位(厘米/英寸),字体大小(以磅为单位)等指定。屏幕上显示的内容,字体大小以及是否为像素完美或与您对生成可扫描副本的要求似乎无关。

现在的问题是,IE6对物理单元和打印样式表的支持是否足够完整?鉴于我为客户制作打印样式表的经验,如果你看错了,IE会在打印过程中崩溃,我说不太可能 - 不是你正在处理的表单的复杂性。

答案 3 :(得分:1)

如果您担心渲染器(IE,Acrobat等)搞砸了,您可以随时在服务器上渲染表单,然后只向用户提供图像。

答案 4 :(得分:0)

迪恩,看看Prince。 Bert Bos和HåkonWiumLie用它来制作their book on CSS。他们在A List Apart article中解释了一下。