我想在Safari中将网页打印为没有任何边距的PDF。页面大小在打印对话框中设置为“A4无边框”。
不管我做了什么,OSX上的Safari在HTML周围增加了额外的边距。检查“打印背景”看看我的意思。
显然,@page-rule对Safari没有影响,但还有其他方法吗?
http://jsfiddle.net/willemvb/psFHC/
@page {
size: 21cm 29.7cm; /*A4*/
margin: 0; /*webkit says no*/
}
html{
margin: 0;
padding: 0;
width: 100%;
}
body {
margin: 0;
padding: 0;
font-family: sans-serif;
width: 100%;
background: #eee;
}
3条答案
按热度按时间ioekq8ef1#
有3件事要考虑:
1.不幸的是,页面的边缘
对Safari 6没有影响,在Chrome 23中有影响。据我所知,只要Safari不支持这一点,就没有解决方案(似乎固定在10mm左右)。
1.页面设置如here所示,您可能必须在“打印...”菜单面板中定义一个自定义的“纸张大小”,没有任何边距(您已经这样做了btw)。
1.显然要照顾到其他内部内容html,身体...没有任何保证金。
lqfhib0f2#
所选答案不完全正确。要正确回答问题,您需要先了解问题。
无边框打印和打印机:
很少有打印机可以“实际”打印无边框打印,即使他们说他们这样做。大多数只是放大打印一点,使其延伸超出实际页面,通常,给予你一个滑块来调整该数额。原因是,大多数打印机没有一个传感器来确定纸张实际上是在那里,它假设纸张在那里,对于大多数打印没有关系,如果它是0,5毫米,甚至1毫米。
对于无边框,这很重要,因为打印出来的周围有一个白色(纸)边框。
出于这个原因,95%的打印机模仿这种“无边框”打印,实际上运行墨水到稀薄的空气一点点,只是为了使纸张被覆盖所有的方式到边缘。打印到稀薄的空气是不好的,可以导致污迹在长期和应该避免,所以打印量超过边缘必须调整到最低限度。
好的大幅面打印机有一个传感器来检测纸张宽度,但它是用来稍微调整纸张,因为长度,50至150米每卷,可以导致甚至0.1毫米错位成为一个问题,并导致卡纸。
为了完全解决这个问题,使用了“出血”,即您实际上将所有内容设计到稍大的纸张上,然后再将其剪切到适当的大小。
关于CSS无边框打印的问题:
要充分理解这个问题,必须熟悉“盒子”。
Box几乎模拟了CSS中每个元素的行为,你要打印的页面通常被某种标签 Package ,或者是一个带有id的div,或者是一个类,如下所示:
我们将讨论黑线,称为 border,它是两个兄弟的“margin”和“padding”。
大多数人不知道的是,每台打印机实际上都报告了它所支持的每种纸张大小的页边距。
这里是一个惠普2800 dtn这样做(只需悬停在纸张大小一段时间,它就会出现)。
“修复”:
Safari正在做正确的事情。我说了...这不是一个错误。
它拒绝无边框打印的原因是它实际上是不可能的(在真实的世界中)。你可以做到这一点,但人们以100%的缩放比例打印它会让打印机修剪掉内容,正如我所描述的,打印机不能打印到边缘。
因此,大多数公司将不得不“适应纸面”利润(默认的OS X行为,缩小到大约98%的缩放),然后在打印机上启用无边框模式,这反过来又会将缩小后的98%缩放版本放大到103%。如果你算一算,你会得到一个奇怪的数字,可能是原始版本的101. 5%(我不敢肯定,如果不除以2,我就不太擅长数学:)这对字体和矢量图形来说并不是一个问题,但它对像素世界造成了严重破坏。像素世界和我一样,默认情况下喜欢数字2,其余的只是“平滑”它。
解决方案:
只有使用命令+p * 和 * 选择纸张大小,才能知道打印机边距。
但是,在CSS中您可以做些什么来获得每个人都喜欢的“所见即所得”的感觉呢?
1.使用您定义的www.example.com上的margindiv.page。注意margin是从包含该div的元素计算的。因此您需要将
page
Package 在actualpage
中为每种媒体类型定义CSS,以便屏幕显示想象中的打印边距(接近真实的的东西),而打印得到的是没有边距的版本。
如果你不能把页面 Package 成另一个div,你可以破解它(即:不太优雅的解决方案)。
xv8emn3q3#
热敏标签打印机可以打印没有页边距。这只是一个用例。我相信还有更多。我刚刚补充了
到我的样式表,Safari拿走了它。所以,它必须被修复。