Что такое код CSS для создания разрывов страниц при печати веб-страниц?

Question

Что такое CSS-код для разрыва страницы при печати? Или еще лучше, есть ли какой-нибудь CSS-фреймворк для печати, такой как JQuery, для манипулирования DOM веб-страниц? Мне нужно печатать веб-страницы с контролем, как Adobe PDF, но без использования стороннего плагина. Отпечатки должны быть точными, например, контролировать количество пикселей, попадающих на верх каждой страницы (например, если мы хотим разместить наш логотип на заголовке каждой страницы.

Есть идеи?

Answer 1

page-break-before: always;

page-break-after: always;

Answer 2

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

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

Для краткого изложения того, как стилизовать HTML для печати, эта статья Smashing Magazine может содержать несколько указателей: Печать в Интернете: решения и методы

Answer 3

Поддержка браузера для печати очень слабая, в лучшем случае.Например, получить что-то вроде изображения заголовка страницы будет довольно сложно;Я не знаю ни одного браузера, который бы даже поддерживал объявление CSS «@page», не говоря уже о функциях запуска содержимого CSS3.

С другой стороны, инструментарий FlyingSaucer PDF для Java делает замечательную работупреобразования XHTML в PDF-файлы (особенно если учесть, что это бесплатно).Мы используем его с Freemarker для шаблонирования «страницы», но он обрабатывает изображения, запускает текст верхнего / нижнего колонтитула, даже ссылки внутри документа.

Answer 4

Я не уверен, какой язык сервера вы используете, но я добился большого успеха с wkhtmltopdf и wicked_pdf для Ruby on Rails.

Answer 5

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

Answer 6

На w3schools.com есть удобный Справочник по CSS . Поскольку большинство из нас не может вспомнить многие необычные свойства CSS, надеюсь, это полезно для вас.