通过css设置打印纸大小答案

【问题标题】：Set printer paper size through css通过css设置打印纸大小
【发布时间】：2013-11-22 10:27:56
【问题描述】：

我的打印机默认尺寸是 A4，我需要使用旧的点阵打印机打印尺寸为 8.5inx5.5in 的工资单。我尝试将每张工资单DIV 设置在固定高度，

width: 175.6mm;
height:123.7mm;
margin-left:auto;
margin-right:auto;

虽然它非常适合工资单尺寸，但打印后，纸张会一直滚动到最后，因为与 A4 不同，工资单纸都被连接在一起。而且我不希望对打印机纸张大小进行任何更改，所以我设置：

@media print 
{
   @page
   {
    size: 8.5in 5.5in;
    size: portrait;
  }
}

但谷歌浏览器的打印预览仍然显示：

实际上可以这样做吗？或者有什么办法可以在打印工资单后强制打印机停止打印以防止它继续滚动纸张？（我认为应该不可能）

附：我只使用谷歌浏览器。

**更新：

我注意到选择“另存为PDF”后纸张大小会改变，如果我选择回我的默认打印机，纸张大小又不正确。

【问题讨论】：

我不太喜欢 size 属性，但是你有两个 size 声明，我猜第一个声明被 'portrait' 覆盖了
@Phix 感谢您的回复。我刚刚删除了它，但纸张尺寸仍然是A4或Letter。
我想打印机对话框将确定纸张大小。让用户修改纸张大小将是一个愚蠢的想法或“功能”。
您使用的是哪个版本的 chrome？

标签： html css google-chrome media-queries printing-web-page

【解决方案1】：

我认为浏览器对打印机设置的访问受到限制。它由操作系统和打印机驱动程序执行（通过选择纸张来源作为拖拉机进纸器或边距作为自定义）。

【讨论】：

【解决方案2】：

它就像这样对我有用

@page {
  size: <%= @size_card[0] %>cm  <%= @size_card[1] %>cm;
  margin: 0;
}

我试着像你说的那样使用“风景”或“肖像”的第二个尺寸属性，但它会覆盖最后一个，所以它不需要，因为你已经在说什么是高度和什么是宽度。

【讨论】：

【解决方案3】：

也许这行得通。

@media print 
{
   @page
   {
    size: 8.5in 5.5in;
    size: landscape;
  }
}

或

@media print 
{
   @page
   {
    size: 5.5in 8.5in ;
    size: landscape;
  }
}

【讨论】：

有趣 - 以这种方式设置大小会隐藏 Chrome 打印对话框中的方向下拉菜单。

【解决方案4】：

今天我用的是 Chrome 32.0.1700.107 m

W3 CSS3 standard established for page sizes 与打印界面中直接从 Chrome 中的“另存为 PDF”选项配合使用效果很好。请记住，在 chrome 的打印界面中使用打印机是非常不同的，因为它使用打印机的默认大小，但在另存为 PDF 选项的情况下，它确实采用 CSS 建立的大小。

多年来，我一直在为不同的项目使用不同的界面和解决方案（例如：直接从服务器生成 PDF 处理繁重且代码混乱，或告诉用户使用 Windows 打印界面等））。这对我来说是一个很好的解决方案，而且似乎是确定的！

现在可以在站点中仅使用 CSS3 创建具有正确纸张大小的 PDF，而无需使用第三方软件或其他类型的技巧。

在您的情况下，最好的解决方案是简单地更改打印机中配置的默认纸张尺寸，我建议用户使用一个小的浮动 div 来提供建议并隐藏打印。但是由于您“不希望对打印机纸张大小进行任何更改”，如果您想避免在服务器端进行更改，则需要 printig 人多做一步：首先保存 PDF，然后将其发送到刚刚创建的 PDF 中的打印机。

【讨论】：

【解决方案5】：

上次我检查时，主要浏览器对@media print 的支持很差。我遇到了与您类似的问题，经过数周的尝试，我不得不放弃并转到服务器端 pdf 生成库 (PDF4NET)。如果您需要排版、打印的文档——我认为 HTML 无法解决问题。

【讨论】：