Jak zablokovat tisk webové stránky pomocí CSS

webové stránky jsou určeny k zobrazení na obrazovce. I když existuje široká škála možných zařízení, která lze použít k zobrazení webu (stolní počítače, notebooky, tablety, telefony, nositelná zařízení, televize atd.), všechny obsahují obrazovku jakéhokoli druhu. Váš web může někdo zobrazit jiným způsobem, bez obrazovky. Odkazujeme na fyzický výtisk vašich webových stránek.

Před lety byste zjistili, že lidé, kteří tisknou webové stránky, jsou docela běžným scénářem. Pamatujeme si, že jsme se setkali s mnoha klienty, kteří byli na webu noví a cítili se pohodlněji při kontrole tištěných stránek webu. Poté nám poskytli zpětnou vazbu a úpravy těchto kousků papíru místo toho, aby se podívali na obrazovku a diskutovali o webových stránkách. Jak se lidé stávali pohodlnějšími s obrazovkami ve svém životě a jak se tyto obrazovky znásobily mnohokrát jsme viděli stále méně lidí, kteří se pokoušeli tisknout webové stránky na papír, ale stále to tak je přihodit se. Tento jev můžete zvážit při plánování svého webu. Chcete, aby lidé tiskli vaše webové stránky? Možná ne. Pokud je to váš případ, máte několik možností.

Jak zablokovat tisk webové stránky pomocí CSS

Je to snadné CSS zabránit lidem v tisku vašich webových stránek. Jednoduše musíte vytvořit 1řádkovou šablonu stylů s názvem "print.css", která obsahuje následující řádek CSS.

body {display: none; }

Tento styl změní prvek „body“ na vašich stránkách na se nezobrazuje - a protože vše na vašich stránkách je podřízeným prvkem body, znamená to, že se nebude zobrazovat celá stránka / web.

Jakmile máte šablonu stylů "print.css", načetli byste ji do svého HTML jako šablonu stylů tisku. Takto byste to udělali - stačí přidat následující řádek k prvku „head“ na vašich stránkách HTML.

Tato informace sděluje prohlížeči, že pokud je tato webová stránka nastavena na tisk, použít tento styl místo všech výchozích stylů, které stránky používají pro zobrazení na obrazovce. Když se stránky přepnou na tento list „print.css“, styl, který způsobí, že se celá stránka nezobrazí, se spustí a vše, co se vytiskne, bude prázdná stránka.

Blokovat jednu stránku po druhé

Pokud nepotřebujete blokovat mnoho stránek na svém webu, můžete blokovat tisk po jednotlivých stránkách s následujícími styly vloženými do záhlaví vašeho HTML.

Tento styl na stránce by měl vyšší specificitu než jakékoli styly uvnitř vašeho externí styly, což znamená, že se stránka vůbec nevytiskne, zatímco ostatní stránky bez tohoto řádku se budou normálně tisknout.

Získejte příznivce se svými blokovanými stránkami

Co když chcete blokovat tisk, ale nechcete, aby vaši zákazníci byli frustrovaní? Pokud uvidí tisk prázdné stránky, mohou se rozrušit a myslet si, že je jejich tiskárna nebo počítač poškozený, a neuvědomují si, že jste v podstatě zakázali tisk!

Abyste se vyhnuli frustraci návštěvníků, můžete získat trochu lepšího uživatele a odeslat zprávu, která se zobrazí, pouze když vaši čtenáři stránku vytisknou - a nahradí tak další obsah. Chcete-li to provést, vytvořte standardní webovou stránku a v horní části stránky, hned za značku body, vložte:

A zavřete tuto značku po napsání veškerého obsahu ve spodní části stránky:

Tato stránka je určena k prohlížení online a nemusí být vytištěna. Tuto stránku naleznete na adrese http://webdesign.lifewire.com/od/advancedcss/qt/block_print.htm

#noprint {display: none; }
#print {display: block; }

#print {display: none; }
#noprint {display: block; }