Могу ли я заставить скачок страницы в HTML-печати?

Я делаю HTML-отчет, который будет доступен для печати, и он имеет «разделы», которые должны начинаться на новой странице.Могу ли я заставить скачок страницы в HTML-печати?

Есть ли способ разместить что-то в HTML/CSS, которое будет сигнализировать браузеру, что ему нужно перейти на новую страницу в этот момент?

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

Благодаря
Daniel

источник

2009-11-02 Daniel Magliola

163

Добавьте класс CSS под названием "Разрыв страницы" (или "рь"), например, так:

.pagebreak { page-break-before: always; } /* page-break-after works, as well */

Затем добавьте пустой DIV тег (or any block element that generates a box), где вы хотите разрыв страницы.

<div class="pagebreak"> </div>

Он не будет отображаться на странице, но сломает страницу при печати.

источник

2009-11-02 22:12:28

Но как и все хорошие вещи в CSS, это не всегда последовательно работать по всем направлениям, так что у Искры из него, чтобы у вас есть гневные пользователей в недоумении, почему ваш сайт печатает кучи дополнительных пустых страниц! – Zoe

+10

Согласно MDN, 'page-break-after'" применяется к элементам блока, которые генерируют поле, поэтому использование пустого элемента '' не будет работать. Лучше всего применить его к части вашего контента. См. Https://developer.mozilla.org/en-US/docs/Web/CSS/page-break-after – nullability

@nullability: Хороший улов. В основном я использовал это на своей старой работе в элементе управления WebBrowser в WinForms, который использовал IE, золотой стандарт следующих стандартов. –

Попробуйте link

<style> 
@media print 
{ 
h1 {page-break-before:always} 
} 
</style>

источник

2009-11-02 22:14:25 jfarrell

Я думаю, что это лучший ответ, поскольку он не требует искажения HTML для достижения визуального эффекта. – FinnNk

Мне на самом деле нравится другой, так как он дает мне больше контроля. Я всегда могу назначить класс «pagebreak» только для H1, который должен сделать переход страницы. Но это все еще хорошее решение. +1 для @media, хотя экран должен игнорировать разрыв страницы раньше, я думаю. Благодаря! –

h1 - пример того, что вы можете использовать в качестве тега для разрыва печати. Вы можете заменить имя и тег там, где вам нравится.вы также можете использовать page-break-after: всегда – jfarrell

Вы можете использовать свойство CSS page-break-before (или page-break-after). Просто установите page-break-before: always на эти элементы уровня блока (например, заголовок, div, p или table элементов), которые должны начинаться с новой строки.

Например, чтобы вызвать разрыв строки перед любым 2-го уровня заголовка и перед любым элементом класса newpage (например, <div class=newpage> ...), вы должны использовать

h2, .newpage { page-break-before: always }

источник

2014-01-21 23:21:44

-1

@Chris Doggett имеет смысл. Хотя, я нашел один забавный трюк на lvsys.com, и он действительно работает на firefox и chrome. Просто разместите этот комментарий в любом месте, где вы хотите, чтобы разрыв страницы был вставлен. Вы также можете заменить тег <p> на любой элемент блока.

<p><!-- pagebreak --></p>

источник

2016-08-30 21:03:41

Это не работает –

Могу ли я заставить скачок страницы в HTML-печати?

ответ

Смежные вопросы