0

我想为网页创建打印布局。它已经被设计成一页，但由于 HTML 和 CSS 不适合打印，我遇到了将“数字”页面与“真正的可打印”页面匹配的问题。我知道有一些@media print and (min-resolution: 72dpi)选项，但我无法预测每台打印机的分辨率。

所以我的问题是：有没有更好的方法将网页或网页的一部分适合一个真正的可打印页面？

编辑：澄清我的担忧。我希望网页的内容始终适合一页。我知道如何为 html 设置打印样式；）我知道 html/css 不是为此而开发的。但我认为有某种解决方案。

我想到的一种方法是生成一个包含所有内容的 PDF，然后将 PDF 页面大小“缩小”到 DIN A4 或我想要的任何内容。但这感觉有点糟糕。

4

2 回答 2

0

通过在样式表声明中添加值为“print”的媒体属性，我会为您的针对打印机的布局推荐一个单独的样式表，如下所示：

<link rel="stylesheet" media="screen" href="<?php echo $Root; ?>styles/layout-screen.php" />
<link rel="stylesheet" media="print" href="<?php echo $Root; ?>styles/layout-print.php" />

然后，在样式表中，您将给 html 元素及其全页大小的每个子元素的宽度设置为“100%”，如下所示。

#html, #body, #wrapper { width:100%; }

当然，高度取决于您拥有的内容量，假设您使用浮动 div 来包含内容。您可能应该获得我所感知的经验水平。请注意，这将使页面宽度适合打印页面，而不管用户的打印机 dpi 分辨率如何。

于 2012-09-03T07:34:58.697 回答
0

您可以使用媒体查询来编写覆盖默认样式的仅打印样式：

@media print {
    /* Your stylesheet for printers here */
}

或者您可以使用单独的样式表：

 <link rel="stylesheet" href="print.css" type="text/css" media="print" />

您不需要预测任何分辨率，但请记住打印机可以覆盖您的样式。因此，如果您需要严格的布局（如发票或任何官方文件），请考虑提供 PDF。

我建议这篇关于设置打印样式的文章。

于 2012-09-03T08:28:57.433 回答