page-break-inside - Český CSS 3 manuál

HTML a CSS Manuál Ostatní vlastnosti page-break-inside - Český CSS 3 manuál

Pomocí CSS 3 vlastnosti page-break-inside nastavujeme zalomení stránky v elementu při tisku stránky. Pro použití je potřeba základní znalost @media.

Hodnoty

  • auto (výchozí) - Zalomení stránky se nastaví automaticky.
  • avoid - Vyhnout se zalomení stránky uvnitř elementu (pokud je to možné).

Pro zalomení stránky po elementu při tisku stránky můžeme použít vlastnost page-break-after a pro zalomení stránky před elementem page-break-before.

Ukázka

Vytvořme si dva prvky div. Oba budou mít hodnotu vlastnosti page-break-inside nastavenou na avoid. Díky této hodnotě bude každý div na své stránce. Na konci druhé stránky budeme mít tlačítko, které po stisknutí vyvolá akci tisku (pomocí JavaScriptu).

<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8" />
                <style>
                @media print
                {
                        div
                        {
                                page-break-inside: avoid;
                        }
                }
                </style>
                <!-- JavaScript -->
                <script type="text/javascript">
                function tisknout()
                {
                        window.print();
                }
                </script>
                <title>page-break-inside</title>
        </head>
        <body>
                <div>
                        <h1>Papír</h1>
                        <p>
                                Papír je tenký, hladký materiál vyráběný zhutněním vlákna.
                                Použitá vlákna jsou obvykle přírodní a založená na celulóze.
                                Nejobvyklejší materiál je buničina vyrobená ze dřeva
                                (většinou smrk), či ze sekundárních vláken (sběrový papír),
                                ale mohou být použity i jiné rostlinné vláknité materiály
                                jako bavlna, a konopí. Teplota vzníceni nad 185 °C.
                        </p>
                        <p>
                                Hromadě několika stovek archů papíru se říká rys papíru (480
                                archů). Papírové archy se mohou chovat jako velmi ostré žiletky
                                a způsobit papírové říznutí.
                        </p>
                        <img src="papir.jpg" alt="Papír" />
                </div>
                <div>
                        <h2>Ruční papír</h2>
                        <p>
                                Papír byl vyráběn původně ze lněného nebo bavlněného odpadu.
                                Se vzrůstající potřebou papíru však bylo potřeba hledat nové
                                technologie, což vedlo k využívání pilin, slámy a starého papíru
                                (jeho využívání vedlo mnohdy k ničení archiválií).
                        </p>
                        <p>
                                Výroba: nabírání papíroviny z kádě na čerpací formu. Původní
                                čerpací formu tvořil laťový rám vyztužený žebry, na kterých bylo
                                upevněno síto. Forma měla dvě části - síto a snímatelný rám -
                                jeho výškou se řídila vrstva papíroviny a tím i gramáž papíru.
                                Formy si mohl papírník vyrábět sám, ale vyráběli je také formaři.
                        </p>
                        <p>
                                Na ručním papíru se objevují stopy síta (žebrování) nazývaný vergé
                                a vodotisky. Objevují se papíry bez stop síta na papíru a bez stop
                                síta v průsvitu - síto bývalo velice husté. Takový papír se nazývá velin.
                        </p>
                </div>
                <button onclick="tisknout()">Tisk</button>
        </body>
</html>

Výsledek:

Vlastnost page-break-inside v CSS 3

 

  Aktivity (1)

Manuál pro vás napsal IT Man
Avatar
Autor se primárně věnuje vývoji webových stránek v PHP a v JavaScriptu (knihovna jQuery). Napsal část manuálu HTML 5 a CSS 3, kde má celkem velký přehled. Jednoduše má v oblibě weby.

Miniatura
Všechny články v sekci
Ostatní CSS vlastnosti

 

 

Komentáře

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zatím nikdo nevložil komentář - buď první!