Печатать HTML на бумаге 8.5x11?

Question

Я хотел бы напечатать наборы данных на 8,5x11 листах бумаги (по одному на листе).Эти наборы отображаются на веб-странице вертикально один за другим (в делениях размером 8,5х11).

Как можно распечатать каждое из этих делений с одинаковым форматированием на отдельных листах бумаги размером 8,5х11 листов?

Answer 1

Вы можете сделать следующее:

1. Попробуйте определить приблизительную высоту <div>, которую можно печатать на одной странице. Это определяется содержимым <div> и не полностью находится под вашим контролем (т. Е. Если данные в основном являются текстовыми, пользователь может выбрать изменение размера шрифта или масштабирование страницы для печати). Однако вы должны быть в состоянии найти приблизительную высоту, которая подходит. Я обнаружил, что для шрифта 12pt он составляет около 900 пикселей в высоту.

2. Создайте класс .page, который использует правила печати CSS-разрыва страницы в таблице стилей печати . Они позволяют вам предложить браузеру, должен ли разрыв страницы происходить до или после вашего элемента.

В итоге вы получите что-то вроде следующего:

HTML

<div class="page">
    /* data */
</div>
<div class="page">
    /* more exciting data */
</div>

CSS

.page {
    font-size: 12pt; 
    height: 900px;  /* You'll need to play with this value */
    page-break-after: always; /* Always insert page break after this element */
    page-break-inside: avoid; /* Please don't break my page content up browser */
}

Для получения дополнительной информации, эта статья ALA дает несколько отличных советов по печати ваших веб-страниц.

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