Question

我创建了一个简单的打印CSS，生成A4页面。

<!doctype html>
<html>
<head>
<style media="print">
    * {margin:0;padding:0}
    @page {size: 297mm 210mm; margin:0mm;}
    html, body {width: 297mm; height: 210mm}
    html {background-color:red}
    body {background-color:green}
</style>
</head>

<body>
    <p>TEST</p>
</body>
</html>

使用Firefox 38.0.1，在打印预览窗口中，正文（绿色）有一个额外的高度，触发第二页 firefox

如果我打印文件，则会打印2页，因此这不仅仅与打印预览有关。

我已经从页面设置部分删除了所有边距以及Firefox添加的所有额外元素（如标题，网址，日期等）

Chrome 43.0.2357.81上的同一页面没有任何问题 chrome

我该如何解决？

Answer 1

使用它，它将直接工作：）

<!doctype html>
<html>
    <head>
        <style>
            @media print {
                * {margin:0;padding:0}
                @page {size: A4 landscape; margin:0mm;}
                html, body {height: 100%;}
                html {background-color:red}
                body {background-color:green}
            }
        </style>
    </head>
    <body>
        <p>TEST</p>
    </body>
</html>

Firefox打印CSS - A4页面上的额外空白页面

1 个答案: