对于字体大小,打印介质使用pt。 请注意,在css样式中设置正文的边距不会调整定义打印机可打印区域的打印机驱动程序中的边距,或由浏览器控制的边距(在某些浏览器上,在打印预览中可能可以调整)......它只会在可打印区域内的文档上设置边距。 您还应该注意到IE7++会自动调整大小以达到最佳匹配,即使您使用cm或mm,也会导致所有内容都错误。要覆盖此行为,用户必须选择“打印预览”,然后将打印大小设置为100%(默认值为Shrink To Fit)。 完全控制打印边距的一个更好的选择是使用@page指令来设置纸张边距,这将影响html body元素之外的纸张边距,通常由浏览器控制,请参见http://www.w3.org/TR/1998/REC-CSS2-19980512/page.html。 这目前在除Safari之外的所有主流浏览器中都有效。 在Internet Explorer中,边距实际上是在此打印的设置中设置为该值的,如果您执行“预览”,则会将其设置为默认值,但用户可以在预览中更改它。
@page
{
size: auto; /* auto is the initial value */
/* this affects the margin in the printer settings */
margin: 25mm 25mm 25mm 25mm;
}
body
{
/* this affects the margin on the content before sending to printer */
margin: 0px;
}
7条答案
按热度按时间t5zmwmid1#
指定打印时,应使用
cm
或mm
作为单位。使用像素将导致浏览器将其转换为与屏幕上类似的内容。使用cm
或mm
将确保纸张上的大小一致。对于字体大小,打印介质使用
pt
。请注意,在css样式中设置正文的边距不会调整定义打印机可打印区域的打印机驱动程序中的边距,或由浏览器控制的边距(在某些浏览器上,在打印预览中可能可以调整)......它只会在可打印区域内的文档上设置边距。
您还应该注意到IE7++会自动调整大小以达到最佳匹配,即使您使用
cm
或mm
,也会导致所有内容都错误。要覆盖此行为,用户必须选择“打印预览”,然后将打印大小设置为100%
(默认值为Shrink To Fit
)。完全控制打印边距的一个更好的选择是使用
@page
指令来设置纸张边距,这将影响html body元素之外的纸张边距,通常由浏览器控制,请参见http://www.w3.org/TR/1998/REC-CSS2-19980512/page.html。这目前在除Safari之外的所有主流浏览器中都有效。
在Internet Explorer中,边距实际上是在此打印的设置中设置为该值的,如果您执行“预览”,则会将其设置为默认值,但用户可以在预览中更改它。
相关答案:Disabling browser print options (headers, footers, margins) from page?
x6h2sr282#
首先说,我试图强迫我所有的用户在打印时使用Chrome,因为其他浏览器创建不同的布局。
this question的回答建议:
然而,我最终使用这个CSS来打印我所有的页面:
特殊情况:长表
当我需要打印几页表格时,
margin:0
和@page
会导致边缘出血:我可以通过this answer解决这个问题:
加上设置
@page
的上下边距:结果:
我宁愿选择一个简洁的解决方案,并与所有浏览器。目前,我希望上面的信息可以帮助一些开发人员与类似的问题。
njthzxwz3#
更新、简单的解决方案
旧溶液
创建节与每一页,并使用下面的代码来调整页边距,高度和宽度。
如果打印A4大小。
然后用户
尺寸:8.27英寸和11.69英寸
然后创建一个包含所有内容的div。
ljo96ir54#
我个人建议使用不同于
px
的度量单位,我不认为像素与印刷品有太大关系;理想情况下,您应该用途:我相信还有其他的例子,这里有一篇关于print-css的优秀文章:Going to Print,通过Eric Meyer。
lqfhib0f5#
我也推荐使用pt而不是cm或mm,因为它更精确。另外,我无法让@page在Chrome(版本30.0.1599.69 m)中工作,它会忽略我为边距设置的任何内容,无论大小。但是,你可以让它在文档的正文边距中工作,这很奇怪。
fnatzsnv6#
你也可以试试这个,使用顶部负边距
}
sqxo8psd7#
如果你知道目标纸张大小,你可以把你的内容放在一个具有特定大小的DIV中,并向该DIV添加一个边距来模拟打印边距。不幸的是,我不相信你除了显示打印对话框之外,对打印功能有额外的控制。