Печать ландшафта или портрета в FireFox и IE 8

В настоящее время я использую последнюю версию Firefox и IE8

Чтобы изменить ориентацию печати, я использовал

@page {
  size: portrait;
}

в моем файле CSS. @страница ссылки

Хотя он утверждает, что @page поддерживается в обоих браузерах, после моего тестирования он вообще не работает, кроме Chrome. Я хотел бы знать, как распечатать страницу в другой ориентации в FireFox/IE8.

Ответ 1

Никакое приложение не должно зависеть от этой функции, чтобы работать с кросс-браузером прямо сейчас, потому что стандарт CSS3 для ориентации страницы для печати по-прежнему выполняется в большинстве браузеров.

Для Google Chrome это прекрасно работает: http://dev.activisual.net/test.html

В конечном счете решение об изменении ориентирующих реле на пользователе во время процесса печати (даже если оно работает), поэтому вы можете просто сообщить пользователям, что они должны печатать страницу в альбомной или портретной ориентации, когда-либо, чтобы предотвратить изменение пользователем ориентации при печати на настольных браузерах.

Вот отчет об ошибке для FF, который был опубликован совсем недавно: https://bugzilla.mozilla.org/show_bug.cgi?id=851441

Вы можете прочитать принятый ответ по этому вопросу для справки: Ландшафтная печать из HTML

Ответ 2

В справочнике MDN говорится:

Вы можете изменять поля, сироты, вдова и разрывы страниц документ. Попытки изменить любые другие свойства CSS будут игнорируются.

Что касается предоставления вам разметки, которая достигает того, чего вы хотите, это будет за пределами того, что разрешено на SO. Кроме того, это может быть немного работы, так как вы хотите, чтобы вторая версия обратной версии IE пыталась выполнить, а также текущее поколение Firefox.

Ответ 3

Макет печати страницы - это портрет по умолчанию, чтобы перейти к пейзажу и увидеть разницу, попробуйте ниже.

Ниже приведен код css поддерживается с версии 19.0, попробуйте, он должен решить вашу проблему: Для IE8 вы должны использовать директиву HTML5 в своем html

<!doctype html>

Код Css:

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

Firefox: https://developer.mozilla.org/en-US/docs/Mozilla_CSS_support_chart Firefox support

IE http://msdn.microsoft.com/en-us/library/hh781508(v=vs.85).aspx enter image description here

Ответ 4

Странно, что этот

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

не работает для вас для последней версии Firefox, так как я сам ее тестировал и прекрасно работает.

Если вы не можете найти что-либо, посмотрите здесь, хотя это не совсем правильный портретный режим (для печати), но вы могут получить некоторые идеи.

Наконец, если вы отчаиваетесь, и вам действительно нужно найти способ сделать это, вы всегда можете сделать снимок экрана с веб-страницы, например html2canvas повернуть изображение, а затем распечатать изображение вместо веб-страницы... Не идеальное решение, но таким образом вы обойдете браузер.

Ответ 5

Я столкнулся с этой проблемой немного позже, проделав простую форму.

Chrome, похоже, лучший браузер для ограничения контроля над процессом печати пользователями. Однако он по-прежнему ограничен, и Firefox/другие браузеры не поддерживают @page.

Мое решение состояло в том, чтобы добавить в таблицу стилей печать @media, чтобы "поощрять" пользователя печатать страницу на портрете. Страница @предназначена только для хрома. display: none; на заголовке, nav и нижнем колонтитуле избавляются от нежелательных дополнений браузера (это работает только в chrome и firefox, т.е. вам все равно нужно выбирать заголовки) У меня есть граница: 0; на поля ввода, потому что это было для формы... Наконец, я поместил ширину и высоту на контейнер div, аналогичный размеру стандартного 8,5 х 11 листов бумаги. Таким образом, он будет хорошо соответствовать странице.

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

} 

В конечном итоге печать на веб-странице по-прежнему очень зависит от браузера/пользователя, и на самом деле этого не может быть сделано. Создание печати @media помогает, но на самом деле единственный способ заставить страницу печатать точно так, как вы хотите, - это создать pdf-версию страницы, которую пользователь мог бы экспортировать.

Ответ 6

Просто перейдите в файл, нажмите на настройку страницы и измените ориентацию. Это работает для меня