如何控制打印字体大小
How to control print font size
我允许我的用户打印,但输出太大(我必须在打印对话框中手动调整到大约 60%)。我使用 css 媒体查询(如下)来控制内容,并尝试更改 html, body{}
的字体大小而不对输出字体大小进行任何更改。打印到 Adobe PDF 打印正确
知道我做错了什么吗?
我的打印Link:
<a href="#" onclick="window.print(); return false;"></a>
我的css:
@media print {
body * {
visibility: hidden;
}
.printme, .printme * {
visibility: visible;
}
.printme {
position: absolute;
left: 0;
top: 0;
}
.printme, .printme:last-child {
page-break-after: avoid;
}
.display-none-on, .display-none-on * {
display: none !important;
}
html, body {
height: auto;
font-size: 12pt; /* changing to 10pt has no impact */
}
}
终于弄明白了,原因有很多。最主要的是我还需要为包含文本的 div 设置字体大小。在主要 css 中,我将 body font-size 设置为 62.5%,将 div font-size 设置为 130%。当我将@media print{} 的 body font-size 设置为 12pt 时,它继续使用 130% div 设置,因此打印得非常大。
我认为我通过更改正文字体大小来调整字体大小的努力是有缺陷的,因为我缩小了 css 并且可能在每次更改后都忘记了缩小。
我允许我的用户打印,但输出太大(我必须在打印对话框中手动调整到大约 60%)。我使用 css 媒体查询(如下)来控制内容,并尝试更改 html, body{}
的字体大小而不对输出字体大小进行任何更改。打印到 Adobe PDF 打印正确
知道我做错了什么吗?
我的打印Link:
<a href="#" onclick="window.print(); return false;"></a>
我的css:
@media print {
body * {
visibility: hidden;
}
.printme, .printme * {
visibility: visible;
}
.printme {
position: absolute;
left: 0;
top: 0;
}
.printme, .printme:last-child {
page-break-after: avoid;
}
.display-none-on, .display-none-on * {
display: none !important;
}
html, body {
height: auto;
font-size: 12pt; /* changing to 10pt has no impact */
}
}
终于弄明白了,原因有很多。最主要的是我还需要为包含文本的 div 设置字体大小。在主要 css 中,我将 body font-size 设置为 62.5%,将 div font-size 设置为 130%。当我将@media print{} 的 body font-size 设置为 12pt 时,它继续使用 130% div 设置,因此打印得非常大。
我认为我通过更改正文字体大小来调整字体大小的努力是有缺陷的,因为我缩小了 css 并且可能在每次更改后都忘记了缩小。