Ako zablokovať tlač webovej stránky pomocou CSS

click fraud protection

internetové stránky sú určené na prezeranie na obrazovke. Aj keď existuje široká škála možných zariadení, ktoré možno použiť na prezeranie stránok (stolné počítače, notebooky, tablety, telefóny, nositeľné doplnky, televízory atď.), všetky obsahujú obrazovku nejakého druhu. Existuje iný spôsob, ako si niekto môže pozrieť váš web, a to bez obrazovky. Odkazujeme na fyzický výtlačok vašich webových stránok.

Pred rokmi by ste zistili, že ľudia tlačiaci webové stránky boli celkom bežným scenárom. Pamätáme si, že sme sa stretli s mnohými klientmi, ktorí boli na webe noví a cítili sa pohodlnejšie pri kontrole vytlačených stránok. Potom nám poskytli spätnú väzbu a úpravy týchto kúskov papiera namiesto toho, aby sme prezerali webovú stránku, aby sme diskutovali o obrazovke. Ako sa ľudia v priebehu svojho života cítili pohodlnejšie s obrazovkami, a tieto obrazovky sa znásobili mnohokrát sme videli čoraz menej ľudí, ktorí sa pokúšali tlačiť webové stránky na papier, ale stále to tak je stať sa. Tento jav môžete zvážiť pri plánovaní svojich webových stránok. Chcete, aby ľudia tlačili vaše webové stránky? Možno nie. Ak je to tak, máte niekoľko možností.

instagram viewer

Ako zablokovať tlač webovej stránky pomocou CSS

Ľahko sa používa CSS aby ľudia nemohli tlačiť vaše webové stránky. Musíte jednoducho vytvoriť šablónu štýlov s jedným riadkom s názvom "print.css", ktorá obsahuje nasledujúci riadok CSS.

body {display: none; }

Tento jeden štýl zmení prvok „body“ na vašich stránkach na sa nezobrazuje - a keďže všetko na vašich stránkach je podradeným prvkom tela, znamená to, že sa nebude zobrazovať celá stránka / web.

Keď už máte svoju šablónu štýlov „print.css“, načítali by ste ju do svojho súboru HTML ako tlačovú šablónu so štýlmi. Takto by ste to urobili - stačí pridať nasledujúci riadok k prvku „head“ na vašich stránkach HTML.


Táto informácia informuje prehliadač, že ak je táto webová stránka nastavená na tlač, použije túto šablónu štýlov namiesto akejkoľvek predvolenej šablóny štýlov, ktorú stránky použijú na zobrazenie na obrazovke. Keď sa stránky prepnú na tento hárok „print.css“, naštartuje sa štýl, vďaka ktorému sa nezobrazí celá stránka, a všetko, čo sa vytlačí, bude prázdna stránka.

Blokujte jednu stránku po druhej

Ak nepotrebujete blokovať veľa stránok na svojom webe, môžete blokovať tlač na stránke po stránke s nasledujúcimi štýlmi vloženými do hlavičky kódu HTML.


Tento štýl na stránke by mal vyššiu špecifickosť ako všetky štýly vo vnútri externé štýly, čo znamená, že sa stránka nevytlačí vôbec, zatiaľ čo ostatné stránky bez tohto riadku by sa stále tlačili normálne.

Získajte priaznivcov so svojimi blokovanými stránkami

Čo ak chcete blokovať tlač, ale nechcete, aby boli vaši zákazníci frustrovaní? Ak uvidia tlač prázdnej stránky, môžu sa rozčúliť a myslieť si, že je ich tlačiareň alebo počítač poškodený, a neuvedomujú si, že ste v podstate zakázali tlač!

Aby ste sa vyhli frustrácii návštevníkov, môžete si nájsť malého milovníka a vložiť správu, ktorá sa zobrazí, iba keď vaši čitatelia vytlačia stránku - a nahradia ďalší obsah. Za týmto účelom vytvorte svoju štandardnú webovú stránku a do hornej časti stránky, hneď za značku body, vložte:


A zavrite túto značku po napísaní celého obsahu v dolnej časti stránky:


Potom, keď zavriete div „noprint“, otvorte ďalšiu div so správou, ktorú chcete zobraziť pri tlači dokumentu:


Táto stránka je určená na prezeranie online a nemusí sa vytlačiť. Túto stránku nájdete na adrese http://webdesign.lifewire.com/od/advancedcss/qt/block_print.htm



Vložte odkaz na svoj tlačený dokument CSS s názvom print.css:


A v tomto dokumente zahŕňajú nasledujúce štýly:

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

Nakoniec vo svojej štandardnej šablóne so štýlmi (alebo v vnútorný štýl do hlavy dokumentu), napíš:

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

Takto zabezpečíte, že sa tlačová správa zobrazí iba na vytlačenej stránke, zatiaľ čo webová stránka sa zobrazí iba na online stránke.

Zvážte používateľskú skúsenosť

Tlač webových stránok je všeobecne zlá skúsenosť, pretože dnešné stránky často neprekladajú dobre na vytlačenú stránku. Ak si neprajete vytvoriť úplne samostatnú šablónu štýlov na diktovanie štýlov tlače, môžete zvážiť použitie krokov uvedených v tomto článku na „vypnutie“ tlače na stránke. Uvedomte si, aký to môže mať vplyv na používateľov, ktorí sa spoliehajú na tlač webových stránok (možno preto, že majú slabé videnie a ťažkosti s čítaním textu na obrazovke) a prijímajte rozhodnutia, ktoré budú vyhovovať vašim stránkam publikum.

Pôvodný článok Jennifer Krynin. Upravil Jeremy Girard.

instagram story viewer