Как убрать ссылку на страницу при печати из браузера
Я видел, как этот вопрос задавался несколькими способами на SO и нескольких других сайтах, но большинство из них либо слишком специфичны, либо устарели. Я надеюсь, что кто-то может дать здесь окончательный ответ, не потворствуя спекуляциям.
Есть ли способ, с помощью CSS или javascript, изменить настройки принтера по умолчанию, когда кто-то печатает в своем браузере? И, конечно же, под «печатью из браузера» я имею в виду некоторую форму HTML, а не PDF или какой-либо другой подключаемый модуль, зависящий от MIME-типа.
Пожалуйста, обратите внимание:
Если некоторые браузеры предлагают это, а другие нет (или если вы знаете, как это сделать только для некоторых браузеров), я приветствую решения для конкретных браузеров.
Точно так же, если вы знаете, что основной браузер имеет определенные ограничения, запрещающие НИКОГДА делать это, это также полезно, но некоторые весьма актуальные документы будут приветствоваться. (просто сказать «что идет вразрез с политикой безопасности XYZ» не очень убедительно, когда XYZ внесла значительные изменения в эту политику за последние три года).
Наконец, когда я говорю «изменить настройки печати по умолчанию», я не имею в виду вечность, просто для своей страницы, и я имею в виду конкретно поля печати, верхние и нижние колонтитулы.
Мне очень хорошо известно, что CSS предлагает возможность изменения ориентации страницы, а также полей страницы. Одна из многих проблем - с Firefox. Если я установлю поля страницы на 1 дюйм, он ДОБАВЛЯЕТ это к половине дюйма, которую он уже установил на место.
Я очень хочу сократить использование PDF-файлов на сайте моего клиента, но основной причиной для беспокойства является нарушение представления (а также отсутствие достоверности).
Есть ли какая-то конкретная причина, почему вы хотите это сделать? Если вы говорите, требование, то, возможно, может быть другое возможное решение . Для меня изменение пользовательских настроек не выглядит хорошим решением .
Я согласен. Я не хочу менять настройки пользователя. Я хочу перезаписать настройки браузера по умолчанию. И причина в том, что альтернатива заключается в использовании PDF, который кажется ненужным, когда все остальное можно сделать доступным для печати с помощью CSS.
Я вижу, вы проверили ответ как решение, но он работает ТОЛЬКО в Chrome. Вы смогли получить правильное решение кросс-браузер? или хотя бы в нескольких браузерах? потому что у меня та же проблема
Недостатком является то, что поведение в разных браузерах не согласовано. Safari по-прежнему не поддерживает настройку полей страницы принтера, но все другие основные браузеры теперь поддерживают его.
С помощью @page директивы вы можете указать поле принтера на странице (которое отличается от обычного поля CSS элемента HTML):
Обратите внимание, что мы в основном отключаем определенные для страницы поля, чтобы добиться эффекта удаления верхнего и нижнего колонтитула, поэтому поле, которое мы устанавливаем для тела, не будет использоваться в разрывах страниц (как прокомментировал Конрад ). Это означает, что оно будет работать только правильно, если печатный контент занимает только одну страницу.
Это не работает в Firefox 3.6 , IE 7 , Safari 5.1.7 или Google Chrome 4.1 .
Установка поля @page действует в IE 8 , Opera 10 , Google Chrome 21 и Firefox 19 .
Хотя в этих браузерах поля страницы установлены правильно для вашего контента, поведение не является идеальным при попытке скрыть верхний / нижний колонтитулы.
Вот как он ведет себя в разных браузерах:
В Internet Explorer в настройках этой печати поле фактически установлено равным 0 мм, и если вы сделаете предварительный просмотр, вы получите 0 мм по умолчанию, но пользователь может изменить его в предварительном просмотре.
Вы увидите , что содержимое страницы на самом деле расположены правильно, но заголовок браузера печати и сноска отображается непрозрачной фон, и так эффективно скрывает содержимое страницы в этой позиции.
В Firefox более новые версии, она расположена правильно, но отображается как заголовок / текст колонтитул и содержание текста, так это выглядит как плохая смесь текста заголовка браузера и содержание страницы.
В Opera содержимое страницы скрывает верхний колонтитул при использовании непрозрачного фона в стандартном CSS, а позиция верхнего / нижнего колонтитула конфликтует с контентом. Неплохо, но выглядит странно, если для поля установлено небольшое значение, которое делает заголовок частично видимым. Также поле страницы не установлено должным образом.
В более новых версиях Chrome верхний и нижний колонтитулы браузера скрыты, если поле @page установлено настолько маленьким, что позиция верхнего / нижнего колонтитула конфликтует с контентом. На мой взгляд, именно так и должно себя вести.
Таким образом, вывод заключается в том, что Chrome имеет лучшую реализацию для скрытия верхнего / нижнего колонтитула.
Для пояснения, это не похоже на удаление заголовков в Firefox 21 или IE10, хотя я подозреваю, что это заставило верхний / нижний колонтитул не занимать место. Он работает с Chrome 28.
@SearchForKnowledge: Да, это так, как я сказал - если вы прочитаете мой ответ под описанием того, как он ведет себя в IE: «Вы увидите, что содержимое страницы действительно расположено правильно, но верхний и нижний колонтитулы браузера скрывают страницу содержание в этой позиции ". Я говорю, что это «имеет эффект» в IE 8, а не то, что он работает так, как мы хотим . Я отредактирую свой ответ, чтобы сделать это более понятным.
Это решение просто не работает вообще , потому что @page поля и body поля - это принципиально разные вещи: body поле применяется только ко всему телу , то есть к верхней части первой страницы и нижней части последней страницы. Для всех промежуточных страниц верх / низ будут по-прежнему иметь нулевое поле.
Вы можете установить поле страницы слишком маленьким, чтобы вместить текст, чтобы отключить это (заимствование из ответа awe ):
Вы можете добавить mozNoMarginBoxes атрибут к тегу, чтобы предотвратить печать URL-адресов, номеров страниц и других вещей, которые Firefox добавляет к полям страницы.
Обратите внимание, что mozDisallowSelectionPrint атрибут в примере не требуется для удаления текста с полей; Посмотрите, что делает атрибут mozdisallowselectionprint в PDF.js? ,
К сожалению, кажется, что нет способа решить эту проблему в Internet Explorer, поэтому вам придется прибегнуть к PDF или попросить пользователей отключить тексты полей.
То же самое касается Сафари; согласно комментарию @Luiz Perez , самые последние версии Safari (8, 9.1 и 10) все еще не поддерживают @page подавление текстов полей.
Я ничего не могу найти в Edge, и у меня нет установки Windows 10 для тестирования.
Отлично работает на Firefox. Так что это вместе с @page < size: auto; margin: 3mm; >поддержкой Chrome и Safari сделали кросс-браузерное решение для меня.
Это решение действительно хорошо работает для удаления нежелательной информации / контента в печатных материалах в FF. Спасибо!
Я протестировал этот фрагмент на Safari 8, 9.1 и 10, и он не удаляет верхний или нижний колонтитул в этих версиях Safari.
Как уже говорилось @Awe, это решение, которое работает в Chrome!
Просто убедитесь, что это ВНУТРИ тегов головы:
Это очень хорошее решение! Удаляет поля и удаляет верхний и нижний колонтитулы. Мое единственное изменение состояло в том, чтобы затем добавить padding: 0.25in 0.5in; в стили тела так, чтобы у меня были точные поля, которые мне нужны для красивой, чистой печати. Работая в Chrome v25, и к счастью для этого конкретного проекта, мы можем попросить конечных пользователей выбрать из пары современных браузеров.
У меня есть аналогичный запрос от клиента, который хочет удалить заголовок, номера страниц и нижний колонтитул HTML. В этом случае клиент представляет HTML-страницу, которая может дублироваться как официальный сертификат. Добавленный URL, страница и заголовок не имеют значения и приводят к не очень приятному конечному продукту. В некотором смысле это выглядит просто дешево.
Media = Print не удалось отключить эти настройки браузера по умолчанию. Единственный обходной путь - попросить пользователя нажать кнопку «Шестерня» и включить / выключить эти элементы. Серьезно, я понятия не имел, что смогу сделать это в течение 20 лет (и мы думаем, что обычный пользователь будет иметь подсказку, чтобы нажать кнопку переключения?).
Если CSS поддерживает Media = Print, он должен поддерживать возможность контролировать весь процесс печати конечного пользователя. Я ценю, что браузеры предоставляют добавленные поля, но почему бы не позволить CSS контролировать общее впечатление от печати - если это то, что нужно. 90% решение может быть 100% с еще тремя полями! Простой:
было бы достаточно.
Опять же, не имеет значения, хочет ли конечный пользователь распечатать его или нет (возможно, ваш клиент очень частный и не хочет, чтобы распечатанные URL-адреса распространялись. Или, возможно, исполнительная группа использует частные сайты для совместной работы?). Рад защищать конечного пользователя, но если кто-то ищет ответ, не отвечайте, говоря, что это право конечного пользователя - показывать или скрывать. Иногда это право клиента оплачивать счета.
В конце концов я сдался, так сильно, как не хотел. Я определенно согласен, что это должно быть выставлено в CSS, так как все браузеры имеют эти настройки, и это элемент презентации. Но вместо этого это сцена в качестве предпочтения уровня приложения, например отключение файлов cookie.
Это официальный стандарт CSS, использующий @Page директиву для установки поля принтера (которое не совпадает с полем основной страницы html). В настоящее время это поддерживается всеми основными браузерами, кроме Safari, но как это влияет на верхний и нижний колонтитулы, меняется. Лучшие реализации в Opera и Chrome.
Попробуйте этот код работает 100% для меня:
для ландшафта:
ДЛЯ Portait:
Правила страницы CSS устанавливают поля, но не удаляют встроенный верхний и нижний колонтитулы, размещенные браузером (URL страницы, номер страницы и т. Д.)
Поскольку вы упомянули «в своем браузере» и firefox, если вы используете Internet Explorer, вы можете отключить верхний / нижний колонтитул страницы, временно установив значение в реестре, см. Здесь пример. AFAIK Я не слышал о способе сделать это в других браузерах. Ответы Даниэля и Миккеля, кажется, сталкиваются друг с другом, я думаю, что где-то в реестре может быть похожая настройка для удаления заголовков / нижних колонтитулов или их настройки. Вы проверили это?
Надеюсь, что это помогает и счастливых праздников, С наилучшими пожеланиями, Том.
В IE7 + вы можете отключить верхний / нижний колонтитул простым нажатием кнопки в окне предварительного просмотра. Не нужно делать это в реестре!
Сегодня вы узнаете, как убрать колонтитул со страниц. Ведь при осуществлении печати интернет-страницы в браузере, автоматически вверху и внизу страницы печатается строка с адресом сайта и номер страницы.
Для всех браузеров такая функция печати включена по умолчанию, но не всем интернет-пользователям она нравится. Запретить браузеру печатать эту лишнюю информацию может каждый. Я покажу вам, как это можно сделать на примере 4 самых популярных интернет-браузеров (Firefox, Google Chrome, Opera и Internet Explorer).
Как убрать колонтитул
В веб-браузере Firefox. Для изменения параметров печати идём в меню «Firefox»-«Печать…»-«Параметры страницы…».
Параметры страницы
В открывшемся окне переходим на вкладку «Поля и колонтитулы».
Вкладка «Поля и колонтитулы»
В разделе «Колонтитулы» во всех позициях выбираем значение «—пусто—» и нажимаем кнопку «ОК».
Установка пустого значения
Отключить печать в интернет-обозревателе Google Chrome. В меню настроек или кликом в окне браузера правой кнопки мышки выбираем кнопку «Печать…».
Пункт меню «Печать»
В следующем окне убираем отметку с «Верхние и нижние колонтитулы», при этом в окне предварительного просмотра мы увидим как будет выглядеть напечатанная страница.
В веб-браузере Opera. В меню браузера Опера переходим на «Печать»-«Параметры печати…».
Параметры печати
В открывшемся окне снимаем отметку с пункта «Печатать колонтитулы» и кликаем на кнопку «ОК».
Снятие отметки
В браузере Internet Explorer. Нажимаем стрелочку на кнопке с изображением принтера и кликаем на «Параметры страницы…».
В разделе «Колонтитулы» во всех позициях выбираем значение «—Пусто—«.
Установка значения «пусто»
К сожалению, как задать эти настройки печати по умолчанию в браузере Internet Explorer, я не нашёл, так что при его использовании надо проделывать эту операцию постоянно. Спасибо за внимание!
Доброго времени.
При печати страницы сайта на лист ещё выводится различная ненужная (мне) информация. В левом-верхнем углу заголовок страницы, в правом-верхнем ссылка на страницу и время печати в правом-нижнем углу.
Собственно вопрос: есть ли способы убрать эту инфу ?
печать параметры страницы
Спасибо за наводку, но это не очень гибкий способ. Каждому клиенту ведь не будешь объяснять что нужно настраивать печать. Все просто нажимают cnrt+p
hitakiri, вам повезло наши клиенты не знают даже про Ctrl+P.
Показываешь им эту картинку, выделяешь место с "Поля: нет" — не понимают. А ЧЕ ТАК СЛОЖНО.
hitakiri: серьезно? В самом начале статьи написано:
media print div //и остальные элементы, которые нам не нужны
>
Вы видимо не поняли, мне не элементы DOM нужно убрать, как это делать я знаю. Попробуйте распечатать страницу, в указанных мной местах у вас будет появляться мета информация о печати которая никак не относится ко всему что вложено в тег body
hitakiri: да, я вас до этого не правильно понял.
Очень не хочется вас разочаровать, но колонтикулы отключать нельзя. Только ручной настройкой в браузере.
Попробуйте сдвинуть поля со служебной информацией (значение 1.0cm подберите под свою страницу):
Если вы - разработчик страницы, то подключите стили для печати, как советует Егор Федосенко
Если же вы как пользователь пытаетесь напечатать чужую страницу - клацните правой кнопкой мыши на странице, выберите "Инспектировать элемент". Дальше выбирайте ненужные элементы и просто удаляйте их из документа клавишей Delete. После такой "очистки" страницы - печатайте то, что осталось обычным способом. Результаты вашей ручной очистки будут сохранены до перезагрузки страницы в браузере.
При печати веб-страницы из браузера по умолчанию последний добавляет верхний и нижний колонтитулы, которые, зачастую, бывают лишними. Чтобы избавиться от этой лишней информации на напечатанном документе необходимо изменить параметры страницы в настройках Вашего браузера.
Для того чтобы отключить печать колонтитулов нам даже не потребуется вызывать частного компьютерного мастера на дом.
Ниже рассмотрим решение проблемы для трёх самых популярных браузеров:
Internet Explorer
Открываем меню «Файл» и выбираем «Параметры страницы…» (чтобы отобразить строку меню браузера требуется нажать клавишу «ALT» на клавиатуре):
В открывшемся окне в разделе «Колонтитулы» следует выбрать «Пусто» в настройках верхнего…:
… и нижнего колонтитулов:
После этого применить настройки и можно печатать документ.
Mozilla Firefox
Для того чтобы отключить колонтитулы при печати из браузера Mozilla Firefox нужно открыть основное меню браузера, выбрать «Печать» — «Параметры страницы»:
В окне программы «Параметры страницы» переходим на вкладку «Поля и колонтитулы», в которой в разделе «Колонтитулы» выбираем «пусто» из выпадающих списков настроек:
Теперь можно печатать и из Mozilla Firefox.
Google Chrome
В браузере Chrome от Google всё намного проще. Нужно просто убрать соответствующую галку перед выводом документа на печать:
Теперь и из Google Chrome напечатанный нами документ не будет содержать ненужной информации.
Иногда возникает необходимость распечатать какую-либо информацию прямо с сайта. Можно, конечно, скопировать нужный нам текст, допустим в Word и запустить печать оттуда, но я сейчас говорю именно о печати из браузера.
Настройки печати в разных web-обозревателях отличаются. Распечатанная из браузера страница сайта на листе бумаги может выглядеть совсем не так, как на экране монитора. Не каждого устроит, если на распечатанном листе помимо нужной информации будет отображен адрес web-сайта, номер страницы и дата.
Если вы не совсем поняли, что я имею в виду – кликните по картинке ниже и все станет ясно:
Чтобы такого не было, в настройках печати браузера достаточно убрать колонтитулы. Там же можно и уменьшить поля страницы, если вас не устраивают слишком большие отступы по краям распечатанного листа.
Сейчас я расскажу, как это сделать в разных браузерах:
В Mozilla Firefox: в строке меню идем в “Файл” – “Параметры страницы” – вкладка “Поля и колонтитулы” – для всех “Колонтитулов” выставляем значение “пусто” (1). Также здесь можем уменьшить размер полей до нужного нам значения (2).
В Internet Explorer: в строке меню идем в “Файл” – “Параметры страницы” – в разделе “Колонтитулы” выставляем везде значение “Пусто” (1). В разделе “Поля” – меняем их значения (2).
В Opera: выбираем в меню “Печать” – “Параметры печати”. Убираем галку с “Печатать колонтитулы” (1). Затем выставляем нужные значения в разделе “Поля страницы” (2).
В Google Chrome: жмем на изображение гаечного ключа – “Печать” – убираем галку с “Настройки. Верхние и нижние колонтитулы” (1). В разделе “Поля” выбираем “Персонализированный и выставляем нужные значения” (2).
Читайте также: