Html 通过css设置打印机纸张大小
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19892484/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Set printer paper size through css
提问by Irene Ling
My printer default size is A4,and I need to print payslip in size 8.5inx5.5in using the old dot matrix printer.
I tried to set every payslip DIVin a fixed height,
我的打印机默认尺寸是 A4，我需要使用旧的点阵打印机打印 8.5 英寸 x 5.5 英寸的工资单。我试图将每个工资单设置DIV在一个固定的高度，
width: 175.6mm;
height:123.7mm;
margin-left:auto;
margin-right:auto;
Although it fit the payslip size perfectly,but after printed,the paper will keep rolling until end of it because payslip paper are all joined unlike A4. And I do not wish to make any changes to printer paper size,so I set:
虽然它完全适合工资单的尺寸，但打印后，纸张会一直滚动直到结束，因为与 A4 不同的是，工资单纸都是连在一起的。而且我不想对打印机纸张尺寸进行任何更改，因此我设置了：
@media print
{
@page
{
size: 8.5in 5.5in;
size: portrait;
}
}
but the print preview of Google Chrome still showing this:
但谷歌浏览器的打印预览仍然显示：
Actually is it possible to do so?Or is there any way to force printer stop printing after payslip printed to prevent it from keep rolling the paper?(which I think should be not possible)
实际上可以这样做吗？或者有什么方法可以在打印工资单后强制打印机停止打印以防止它继续滚动纸张？（我认为这应该是不可能的）
P.S. I am using Google Chrome only.
PS 我只使用谷歌浏览器。
**Updated:
**更新：
I noticed the paper size will change after I choose to "Save as PDF",if I choose back my default printer,the paper size is incorrect again.
我注意到选择“另存为 PDF”后纸张尺寸会发生变化，如果我选择回默认打印机，纸张尺寸又不正确。
回答by pixparker
maybe this work.
也许这项工作。
@media print
{
@page
{
size: 8.5in 5.5in;
size: landscape;
}
}
or
或者
@media print
{
@page
{
size: 5.5in 8.5in ;
size: landscape;
}
}
回答by imjosh
Last time I checked, @media print is very poorly supported by the major browsers. I had a problem similiar to yours, and after weeks of trying I had to give up and go to a server-side pdf generation library (PDF4NET). If you need typeset, printed documents- I don't think HTML is going to do the trick.
上次我查了一下，主流浏览器对@media print 的支持很差。我遇到了与您类似的问题，经过数周的尝试，我不得不放弃并转到服务器端 pdf 生成库 (PDF4NET)。如果您需要排版、打印文档 - 我认为 HTML 不会成功。
回答by DavidTaubmann
Today I'm using Chrome 32.0.1700.107 m
今天我使用的是 Chrome 32.0.1700.107 m
The W3 CSS3 standard established for page sizesworks great with the "SAVE AS PDF" option directly from Chrome in the printing interface. Remember that using a printer is very different in chrome's printing interface, as it uses the printers default size, but in the case of SAVE AS PDF option it DOES take the size that CSS established.
为页面大小建立的W3 CSS3 标准与打印界面中直接来自 Chrome 的“另存为 PDF”选项配合得很好。请记住，在 chrome 的打印界面中使用打印机是非常不同的，因为它使用打印机的默认大小，但在另存为 PDF 选项的情况下，它确实采用 CSS 建立的大小。
I have had years of trouble with different interfaces and go-around solutions for different proyects (for example: generating PDF's directly from server which was too heavy in processing and messy in code, or telling users to use windows printing interface, etc). This one is a great solution for me and seems to be definitive!
多年来，我在不同的界面和针对不同项目的解决方案方面遇到了麻烦（例如：直接从服务器生成 PDF 处理繁重且代码混乱，或者告诉用户使用 Windows 打印界面等）。这对我来说是一个很好的解决方案，似乎是确定的！
Now it's possible to create PDF's with the right size of paper using only CSS3 in the site, and no need of using third party software nor other kind of tricks.
现在可以在站点中仅使用 CSS3 创建具有合适纸张尺寸的 PDF，无需使用第三方软件或其他类型的技巧。
In your case the best solution is to simply change the default paper size configured in the printer, which I adviced to the users with a little floating div that gave the advice and is hidden from printing. But as you do "not wish to make any changes to printer paper size", if you want to avoid making changes on the server side, you would require one more step from the person printig: first save the PDF and then send it to the printer from the PDF just created.
在您的情况下，最好的解决方案是简单地更改打印机中配置的默认纸张尺寸，我向用户建议使用一个小的浮动 div，该 div 给出了建议并且隐藏在打印中。但是由于您“不希望对打印机纸张大小进行任何更改”，如果您想避免在服务器端进行更改，则需要打印人员再执行一个步骤：首先保存 PDF，然后将其发送到从刚刚创建的 PDF 打印。
回答by RAJMOHAN
I think browser has limited access to the setting of the Printer.it is executes by both operating system and Printer Driver(by selecting paper source as tractor feeder or margins as customize).
我认为浏览器对打印机设置的访问权限有限。它由操作系统和打印机驱动程序执行（通过选择纸张来源作为拖纸器进纸器或选择边距作为自定义）。
回答by Ramon Marques
It worked for me just like this
它就像这样对我有用
@page {
size: <%= @size_card[0] %>cm <%= @size_card[1] %>cm;
margin: 0;
}
I tried like you are saying with a second size property for "landscape" or "portrait" but it overrides the last so it doesn't need since you are saying already what is height and what is width.
我试过就像你说的“风景”或“肖像”的第二个大小属性，但它覆盖了最后一个，所以它不需要，因为你已经在说什么是高度，什么是宽度。
