10

目前我正在使用 FireFox 最新版本和 IE8

为了改变打印的方向，我用

@page {
  size: portrait;
}

在我的 CSS 文件中。 @page 参考

虽然它声称两种浏览器都支持@page，但经过我的测试，除了Chrome之外它根本不起作用。我想知道如何在 FireFox / IE8 中以不同的方向打印页面。

4

6 回答 6

14

任何应用程序现在都不应该依赖此功能来跨浏览器工作，因为大多数浏览器仍在实施有关打印页面方向的 CSS3 标准。

对于谷歌浏览器它工作得很好：http ://dev.activisual.net/test.html

最终，在打印过程中改变方向的决定取决于用户（即使它有效），所以你可以简单地让用户知道他们应该以横向或纵向打印页面，但通常不会有一种防止用户在桌面浏览器上打印时更改方向的方法。

这是最近报告的 FF 错误报告： https ://bugzilla.mozilla.org/show_bug.cgi?id=851441

您可以阅读此问题的已接受答案以供参考： 从 HTML 进行横向打印

于 2013-06-08T03:57:44.630 回答
3

正如 MDN 参考所说：

您只能更改文档的页边距、孤立点、窗口和分页符。更改任何其他 CSS 属性的尝试将被忽略。

至于为您提供实现您想要的标记，这将超出 SO 允许的范围。此外，这可能需要一些工作，因为您希望两代后的 IE 版本尝试与当前一代 Firefox 一样好。

于 2013-06-08T03:02:31.377 回答
1

页面打印布局默认为纵向，要更改为横向并查看差异，请尝试以下操作。

从 19.0 版本开始支持以下 css 代码，试试吧，它应该可以解决您的问题：对于 IE8，您应该在 html 中使用 HTML5 指令

<!doctype html>

CSS代码：

@media print{@page {size: landscape}}

火狐：https ://developer.mozilla.org/en-US/docs/Mozilla_CSS_support_chart 火狐支持

IE http://msdn.microsoft.com/en-us/library/hh781508(v=vs.85).aspx 在此处输入图像描述

于 2013-06-14T22:42:47.523 回答
0

这很奇怪

{
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

对最新版本的 Firefox 不起作用，因为我自己测试过它并且工作正常。

如果您找不到任何东西，请看这里，即使这不是完全正确的纵向模式（用于打印），但您可能会得到一些想法。

最后，如果您感到绝望并且您真的需要找到一种方法来做到这一点，您可以随时截取网页截图，例如html2canvas旋转图像，然后打印图像而不是网页......不是一个理想的解决方案但是这样你就绕过了浏览器。

于 2013-06-11T05:39:35.553 回答
0

不久前，我在制作一个简单的表格时遇到了这个问题。

Chrome 似乎确实是限制用户控制打印过程的最佳浏览器。但是它仍然受到限制，并且 Firefox/其他浏览器不支持@page。

我的解决方案是在样式表中添加@media print 以“鼓励”用户以纵向打印页面。@page 仅适用于 chrome。显示：无；在页眉、导航和页脚上，去掉不需要的浏览器添加（这只适用于 chrome 和 firefox，即你仍然必须选择没有标题）我有一个边框：0；在输入字段上，因为它是一个表单...最后我在容器 div 上放了一个宽度和高度，类似于标准 8.5 x 11 纸的大小。所以它会很好地适合页面。

@media print{
    @page {size: auto; margin: auto;}
    header nav, footer {display: none;}
    input {border: 0px;}
    #container  {width:9.1in; height:10in;}

}

最终，网页打印仍然非常依赖于浏览器/用户，并且确实没有太多可以做的事情。制作@media print 会有所帮助，但真正让页面完全按照您的要求打印的唯一方法是生成用户可以导出的页面的 pdf 版本。

于 2013-06-11T18:52:33.387 回答
-6

只需转到文件，单击页面设置并更改方向。这对我有用

于 2015-09-02T14:48:52.203 回答