Oldaltörés - CSS-trükkök

Anonim

Nincs tényleges page-breaktulajdonság a CSS-ben. Ez valójában egy sor 3 tulajdonságok: page-break-before, page-break-afterés page-break-inside. Ezek a tulajdonságok segítenek meghatározni, hogy a dokumentum hogyan viselkedjen nyomtatáskor. Például egy nyomtatott dokumentum könyvszerűbbé tételéhez.

Tulajdonságok

oldaltörés előtti

A page-break-beforetulajdonság hozzáad egy oldaltörést az elem elé, amelyre alkalmazzák.

Megjegyzés : ezt a tulajdonságot éppen egy általánosabb break-beforetulajdonság váltja fel . Ez az új tulajdonság az oszlop- és régiótöréseket is kezeli, miközben szintaktikailag kompatibilis azokkal page-break-before. Ezért használat előtt page-break-beforeellenőrizze, hogy használhatja-e break-beforehelyette.

Ennek gyakori alkalmazása a választóra való alkalmazás, #commentsígy a megjegyzésekkel ellátott oldalt kinyomtató felhasználó könnyen választhatja az egész dokumentum kinyomtatását, de abbahagyja a megjegyzéseket.

oldaltörés

A page-break-aftertulajdonság hozzáad egy oldaltörést az elem után, amelyre alkalmazzák.

Megjegyzés : ezt a tulajdonságot éppen egy általánosabb break-aftertulajdonság váltja fel . Ez az új tulajdonság az oszlop- és régiótöréseket is kezeli, miközben szintaktikailag kompatibilis azokkal page-break-after. Ezért használat előtt page-break-afterellenőrizze, hogy használhatja-e break-afterhelyette.

oldalbetörés

A page-break-insidetulajdonság hozzáad egy oldaltörést az elemen belül, amelyre alkalmazzák.

Szintaxis

page-break-after : auto | always | avoid | left | right page-break-before : auto | always | avoid | left | right page-break-inside : auto | avoid

A leftés rightértékeit page-break-before, és page-break-afternézze meg a spread elrendezés (mint egy könyv), ahol külön jobb és bal oldalon. Így működnek:

  • left egy vagy két oldaltörést kényszerít az elem után úgy, hogy a következő oldal bal oldalként legyen formázva.
  • right egy vagy két oldaltörést kényszerít az elem után úgy, hogy a következő oldal jobb oldalként legyen formázva.

Tekintsük alwaysmindkettő keverékének. A specifikáció szerint:

A megfelelő felhasználói ügynök értelmezheti a „bal” és a „jobb” értékeket „mindig” -ként.

Példa

@media print ( h2 ( page-break-before: always; ) h3, h4 ( page-break-after: avoid; ) pre, blockquote ( page-break-inside: avoid; ) )

Ez a kódrészlet 3 dolgot végez:

  • az oldalszámtörést kényszeríti az összes h2címsor elé (talán a dokumentumban található h2 címkék olyan fejezetcímek, amelyek friss oldalt érdemelnek)
  • megakadályozza az oldalrészeket közvetlenül az alcímek után, mert furcsának tűnik
  • megakadályozza a precímkék és a blokk szintű idézetek belsejében történő törést

Böngésző támogatás

Króm Szafari Firefox Opera AZAZ Android iOS
Bármi Bármi Bármi 7+ 4+ TBD TBD

Nyomtathat mobileszközökről, például iOS-en az AirPrintről, de még nem teszteltünk ennyit. Ha valakinek vannak adatai a támogatásról, ossza meg velünk.