html - 修改打印的 HTML 页面的顶部和底部边距

Question

我希望在每个打印页面的顶部和底部都有 75px 的边距。我尝试将边距放在正文和包装器 div 上，但这两个选项都只是在整个文档的顶部和底部添加边距。这在文档的顶部给出了 75px，然后在第二页的顶部/底部可能有 10px，最后一页将具有底部边距。

如果有帮助，我附上了一张图片：http: //imgur.com/6tbHzs4

Answer 1

其他答案只是部分正确。您应该使用具有物理尺寸的单位（我更喜欢使用orpt代替）并且您可能想要使用打印样式表。但是，如果您想设置打印页面的顶部和底部边距，您还必须使用@page 规则。你可能需要这样的东西：cmmm

<style>
@page {
    margin: 75pt 0;
}
</style>

Answer 2

您应该使用 cm 或 mm 作为单位（while Printing）。

当您指定打印时，像素将导致浏览器将其转换为类似于屏幕上的样子。

使用 cm 或 mm 以确保纸张上的尺寸一致。

body {
    margin: 0mm 25mm 25mm 0mm;
}

Answer 3

将媒体类型添加到您的 CSS

<style>
    div {
        font-family: arial;
        font-size: 10px;
        margin: 10px 10px;
    }
</style>

<style media="print">
    // CSS here will only be applied when printing
    div {
        margin: 5px 5px;
    }
</style>

您的 html 将具有上述所有 css，但更改了边距值