CSS приклад: page-break-inside

Internet ExplorerChromeOperaSafariFirefoxAndroidiOS
8.0+7.0+

Коротка інформація

Значення за замовчуваннямauto
НаслідуєтьсяНі
ЗастосовуєтьсяДо блочних елементів
Відсотковий записНе застосовується
Посилання на специфікаціюhttp://www.w3.org/TR/CSS21/page.html#propdef-page-break-inside

Версії CSS

CSS 1CSS 2CSS 2.1CSS 3

Опис

Дозволяє або забороняє розрив сторінки всередині елемента при друку.

Синтаксис

page-break-inside: auto | avoid | inherit

Значення

auto
Вставляє розрив сторінки за необхідності.
avoid
Забороняє розрив сторінки всередині елемента.
inherit
Наслідує значення батька.

Приклад

HTML5CSS2.1IECrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>page-break-inside</title>
  <style>
   @media print {
    p {
     page-break-inside: avoid;
    } 
   } 
  </style>
 </head>
 <body>
  <h2>Мусорні пакети</h2>
  <p>Історія про те, як одного разу мусорних пакетів виявилося трохи більше,  
     ніж бажалося, як і для чого їх можна використовувати, і що з цього 
     вийшло.</p>
  <p class="more">Читати далі</p>
 </body>
</html>

Часті запитання

  • Q: Як використовувати page-break-inside в CSS?

    A: Застосовується для контролю розриву сторінки всередині блоків.

  • Q: Як використовувати page-break-inside відносно таблиць в CSS?

    A: Можна використовувати для управління тим, чи сторінка може розриватися всередині таблиці.

  • Q: Як використовувати page-break-inside в друкарських стилях CSS?

    A: Важливо для контролю розриву сторінок при друку документів.

  • Q: Як уникнути розриву сторінки всередині блоку за допомогою page-break-inside?

    A: Можна встановити значення 'avoid' для уникнення розриву сторінки всередині блоку.

  • Q: Чи всі браузери підтримують властивість page-break-inside в CSS?

    A: Підтримка може відрізнятися в різних браузерах, слід перевірити сумісність.