Нумерация страниц с колонтитулами - PullRequest
0 голосов
/ 16 января 2012

Я хочу подготовить страницу для печати, которая должна быть разбита на страницы формата А4. И эти страницы должны иметь верхний и нижний колонтитулы.

Эта страница увеличена на 3 таблицы. Первая таблица является заголовком, вторая таблица - содержимым, третья - нижним колонтитулом.

Контент должен быть разбит на вторые таблицы (я назвал его «таблицей контента»).

Например:

если содержимое имеет эти строки (мы определяем высоту таблицы содержимого = 600 раньше)

<tr height="100"><td> row1 </td></tr>
<tr height="300"><td> row2 </td></tr>
<tr height="150"><td> row3 </td></tr>
<tr height="100"><td> row3 </td></tr>
<tr height="250"><td> row3 </td></tr>

первые 3 строки должны быть на первой странице печати, остальные 2 строки должны быть на второй странице печати. ​​

Вот так:

Первая страница печати:

< Header table >
</ Header table >
< Context table >
  <tr height="100"><td> row1 </td></tr>
  <tr height="300"><td> row2 </td></tr>
  <tr height="150"><td> row3 </td></tr>
</ Context table >
< Footer table >
</ Footer table >

Вторая страница печати:

< Header table >
</ Header table >
< Context table >
  <tr height="100"><td> row3 </td></tr>
  <tr height="250"><td> row3 </td></tr>
</ Context table >
< Footer table >
</ Footer table >

Я делаю это раньше с помощью функции jQuery height (). Я измерил высоту всех строк и сравнил их с высотой таблицы содержимого (600). Затем я пишу страницы для печати после разделения строк с помощью функции document.write. Но это медленно на длинных страницах.

Я хочу сделать это снова, используя другой лучший способ. Как я могу это сделать? Я надеюсь, вы понимаете мой вопрос.

1 Ответ

1 голос
/ 16 января 2012

http://w3schools.com/cssref/pr_print_pageba.asp http://www.javascriptkit.com/dhtmltutors/pagebreak.shtml

Просто используйте CSS.

Для верхнего и нижнего колонтитула вы можете использовать положение: исправлено. Заголовок: top: 0px Нижний колонтитул: нижний: 0px;

<div class='header'></div>
<div class='content'></div>
<div class='footer'></div>

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...