Распечатать CSS для большой таблицы

Question

У меня довольно большая таблица, которая разделена на более мелкие секции с разделительными строками

<table>
<tr><th>Heading</th>...</tr>
<tr><td>Content</td>...</tr>
<tr><td>Content</td>...</tr>
<tr><td>Content</td>...</tr>
<tr class='spacer_row'><td></td></tr>
<tr><th>Heading</th>...</tr>
<tr><td>Content</td>...</tr>
<tr><td>Content</td>...</tr>
<tr><td>Content</td>...</tr>
<tr class='spacer_row'><td></td></tr>
<tr><th>Heading</th>...</tr>
<tr><td>Content</td>...</tr>
<tr><td>Content</td>...</tr>
<tr><td>Content</td>...</tr>
<tr class='spacer_row'><td></td></tr>
.........
.........
</table>

Я создаю файл print.css. Я бы хотел, чтобы при необходимости разрывы страниц выполнялись на spacer_row,Как использовать свойства css для разрыва страницы?

Answer 1

Это правило css обеспечит запуск новой страницы после каждой строки распорки:

.spacer_row
{
   page-break-after: always;
}

См. page-break-after.

Answer 2

Попробуйте, хотя я сам не проверял. У меня были хорошие результаты на страницах, использующих его на div, p и других тегах. Мог бы работать:

CSS (сообщите браузеру, чтобы в теге tbody не было разрыва страницы)

tbody {page-break-inside:avoid}

HTML (Оберните каждую группу строк в тег tbody и сохраните ваши разделительные строки)

<table>
  <tbody>
    <tr><th>Heading</th>...</tr>
    <tr><td>Content</td>...</tr>
    <tr><td>Content</td>...</tr>
    <tr><td>Content</td>...</tr>
    <tr class='spacer_row'><td></td></tr>
  </tbody>
  <tbody>
    <tr><th>Heading</th>...</tr>
    <tr><td>Content</td>...</tr>
    <tr><td>Content</td>...</tr>
    <tr><td>Content</td>...</tr>
    <tr class='spacer_row'><td></td></tr>
  </tbody>
  <tbody>
    <tr><th>Heading</th>...</tr>
    <tr><td>Content</td>...</tr>
    <tr><td>Content</td>...</tr>
    <tr><td>Content</td>...</tr>
    <tr class='spacer_row'><td></td></tr>
  </tbody>
  <tbody>
    .........
    .........
  </tbody>
</table>

Это хороший стартовый тест.

В производстве я бы не стал вставлять разрыв страницы внутри: избегать использования css для всех тегов tbody и вместо этого создавать класс css, который можно применять к тегам tbody или любых контейнеров. Вот причина: я обнаружил ошибку в IE (вплоть до IE8), когда если вы вкладываете контейнеры с таким CSS и IE вынуждены разрывать страницу внутри, IE, похоже, усекает остальную часть страницы.

К сожалению, на этой странице w3schools.com написано, что единственный браузер, поддерживающий разрыв страницы, - это Opera. Здесь надеются на лучшую поддержку в будущем