CSS форматирование печати А4

Question

Как я могу кодировать стиль CSS, чтобы принудительно устанавливать определенные поля страницы для веб-страницы при печати и быть действительным для IE и Firefox?

Answer 1

Используйте тип носителя "печать" (@media print).

Не устанавливайте фиксированную ширину или максимальную ширину. Вместо этого сделайте содержимое жидким. Если вы укажете любое с помощью (px, em, pt, cm), вы всегда столкнетесь с одной или другой проблемой, потому что разные браузеры добавляют разные поля.

A4, письмо, A3, это не ваше дело. Вашему документу все равно. Пользователь может распечатать ваш документ на любой имеющейся у него бумаге, потому что ваш контент нестабилен.

Найдите несколько советов о CSS для печати здесь.

Answer 2

Один из способов - использовать SVG. С SVG вы можете использовать что-то вроде этого:

<svg width="19cm" height="26.5cm" viewBox="0 0 1900 2650" xmlns="http://www.w3.org/2000/svg" version="1.2">

Тогда вы просто убедитесь, что все ваши элементы находятся в пределах вашего просмотра 1900x2650.

К сожалению, это включает в себя "воссоздание" вашей страницы в SVG, что довольно неудобно. Кажется, что это необходимо, хотя. Решения HTML и CSS не могут гарантировать, что контент не будет перетекать на несколько страниц, если вы предполагали, что он будет одной страницей.