Chrome 打印网站，缺少布局选项

Posted 2023-03-06

【中文标题】Chrome 打印网站，缺少布局选项

【英文标题】：Chrome printing website, missing layout options

【发布时间】：2016-07-19 05:46:04

【问题描述】：

我一直在创建一个网站，该网站的一部分旨在以纵向模式打印在小报纸上。我遇到的问题是，当 Chrome 中出现打印对话框时，它缺少“布局”选项。

在此屏幕截图中，左侧显示了我的对话框的外观与我打印其他网站时的外观。具有讽刺意味的是，即使我创建的其他网站也有如右图所示的选项，这是所需的行为。

我的问题是，是什么控制了这种行为？我该如何纠正？在搜索网络时，我看到的唯一提及是 Chrome 显示 PDF 文件时，但我显示的是网页。

如果您能提供任何见解，我们将不胜感激。

提前致谢

【问题讨论】：

您的网站有@media print CSS 规则吗？

版主可以取消关闭这个问题吗？这个问题和下面的答案对我和其他考虑投票数量的人都非常有帮助。此外，这个问题肯定与编程有关，因为它与 CSS、@print 和媒体声明有关。我假设版主当时没有意识到这一点，但这应该是一个真正的问题。谢谢

投票重新开放，因为这围绕着对浏览器有影响的 CSS 属性...所以它与任何其他 CSS 相关问题并没有完全不同。

【参考方案1】：

如果您在打印 CSS 中有 @page 大小声明，这将覆盖（并隐藏）打印对话框上的方向。要覆盖在其他地方设置的声明（例如 Bootstrap 4 执行此操作），您可以添加：

@page 
  size: auto;

【讨论】：

非常感谢！这正是我的问题！

这将被放入单独的 CSS 而不是内联，否则声明将被忽略。

注意，这不需要在@media print 中，因为它只适用于打印，请参阅developer.mozilla.org/en-US/docs/Web/CSS/@page

【参考方案2】：

只是对已接受答案的快速补充..

对于那些无法编辑您尝试打印的页面的 css 的人，您可以安装名为“Stylus”（link here）的 Chrome 扩展程序，并创建一个新样式只需上述建议：

​​​@page 
  size: auto;

这将启用任何/每个网页上打印对话框中缺少的选项..