1

我正在编写用于打印网页的 CSS 样式表并遇到以下问题：Firefox 为 @page 指令添加了额外的边距。

这是一个例子。

HTML：

<html>
    <head>
        <title>CSS Print Test</title>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
        <div id="content">
            Print Me!
        </div>
    </body>
</html>

CSS：

html,
body,
div {
    margin: 0;
    padding: 0;
}

#content {
    border: 1px solid;
}

@page
{
    size: A4 portrait;
    margin: 30mm 30mm 30mm 30mm;
    padding: 0;
}

这应该给页面每边 3 厘米的边距。它适用于 Chrome (29.0) 和 IE 10，但不适用于 Firefox (21.0)。使用 Firefox 打印页面时，每边的边距大约为 35 毫米。

是否有简单的解决方案或至少对此行为进行解释？

4

1 回答 1

0

尝试这个：

@page { /* for for all browsers except Firefox */
    size: A4 portrait;
    margin: 30mm;
    padding: 0;
}

@-moz-document url-prefix() { /* only for Firefox, page margin - 5mm */  
    @page {margin:25mm;}
}
于 2015-03-18T09:34:49.370 回答