Предпросмотр печати: проверить статью до экспорта в PDF
Экранный вид не гарантирует удобную печать. В упражнении проверяются переносы страниц, длинные примеры, поля и читаемость текста в отдельном режиме предпросмотра.
Назначение
Экранный вид не гарантирует удобную печать. В упражнении проверяются переносы страниц, длинные примеры, поля и читаемость текста в отдельном режиме предпросмотра.
Как это работает
Правила @media print действуют для печатного представления. Сначала убирайте только явно ненужные элементы интерфейса. Основной текст, подписи, адреса и примеры должны оставаться доступными независимо от цветного фона.
Пример
@media print {
.demo-toolbar { display: none; }
article { max-width: none; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; }
h2, h3 { break-after: avoid; }
}Что должно получиться
В печатном режиме панель примера скрывается, а длинный код получает возможность переноситься. Запрет разрыва после заголовка является указанием раскладке, но результат необходимо оценить на конкретной странице.
Граница применения и частая ошибка
Не назначайте break-inside:avoid всему длинному article: блок может не помещаться на листе. Нельзя полагаться на печать фоновых цветов, поскольку настройка может быть отключена. Браузеры и выбранные размеры бумаги влияют на результат.
Самостоятельная проверка
Сделайте учебную статью на несколько листов с длинным кодом и таблицей. Откройте предпросмотр, сравните портретную и альбомную ориентацию, проверьте первый и последний лист. Сохраните PDF локально и прочитайте его отдельно.