Kuidas blokeerida veebilehe printimine CSS-iga

click fraud protection

veebilehed on mõeldud ekraanil vaatamiseks. Kuigi saidi vaatamiseks saab kasutada paljusid erinevaid seadmeid (lauaarvutid, sülearvutid, tahvelarvutid, telefonid, kantavad seadmed, telerid jne.), on neil kõigil mingisugune ekraan. On veel üks viis, kuidas keegi võib teie veebisaiti vaadata, nii et see ei sisalda ekraani. Me peame silmas teie veebilehtede füüsilist väljatrükki.

Aastaid tagasi leidsite, et veebisaite printivad inimesed olid üsna tavaline stsenaarium. Mäletame kohtumist paljude klientidega, kes olid veebis uued ja tundsid end mugavamalt saidi prinditud lehti vaadates. Seejärel andsid nad meile nende paberitükkide kohta tagasisidet ja toimetasid selle asemel, et veebisaidi arutamiseks ekraani vaadata. Kuna inimesed on ekraanil oma elu jooksul mugavamaks muutunud ja neid ekraane on mitmekordistunud mitu korda oleme näinud üha vähem inimesi, kes üritavad veebilehtedele paberile trükkida, kuid siiski juhtuma. Võite seda nähtust kaaluda, kui kavandate oma veebisaiti. Kas soovite, et inimesed printiksid teie veebilehti? Võib-olla sa seda ei tee. Sel juhul on teil mõned võimalused.

instagram viewer

Kuidas blokeerida veebilehe printimine CSS-iga

Seda on lihtne kasutada CSS et inimesed ei saaks teie veebilehti printida. Peate lihtsalt looma 1 rea stiililehe nimega "print.css", mis sisaldab järgmist CSS-i rida.

body {kuva: puudub; }

See üks stiil muudab teie lehtede "keha" elemendi ei kuvata - ja kuna kõik teie lehtedel on kehaelemendi laps, tähendab see, et kogu lehte / saiti ei kuvata.

Kui teil on stiilileht "print.css", laadite selle oma kausta HTML printimisstiilina. Tehke seda nii - lisage lihtsalt järgmine rida oma HTML-lehtede elemendile "head".


See teave ütleb brauserile, et kui see veebileht on seatud printima, siis kasutage seda stiilitabelit selle asemel, et vaikelaadilehte, mida lehed ekraanil kuvamiseks kasutavad. Kui lehed lülituvad sellele lehele "print.css", saab alguse stiil, mis muudab kogu lehe kuvamata, ja kõik, mis prinditakse, oleks tühi leht.

Blokeeri üks leht korraga

Kui teil pole vaja oma saidil paljusid lehti blokeerida, võite lehe haaval printimise blokeerida järgmiste stiilidega, mis on kleebitud teie HTML-i pähe.


Sellel lehesisesel stiilil oleks suurem spetsiifilisus kui ühelgi teie stiilis välised stiililehed, mis tähendab, et leht ei prindiks üldse, samas kui teised lehed, kus seda rida pole, prindiksid endiselt normaalselt.

Hangi oma blokeeritud lehtedega fänn

Mis siis, kui soovite blokeerida printimise, kuid ei soovi, et teie kliendid pettuksid? Kui nad näevad tühja lehe printimist, võivad nad häirida ja arvavad, et nende printer või arvuti on katki, ega saa aru, et olete printimise sisuliselt keelanud!

Külastajate pettumuse vältimiseks võite olla veidi fänn ja panna sõnumi, mis kuvatakse ainult siis, kui teie lugejad lehe printivad - asendades muu sisu. Selleks koostage oma tavaline veebileht ja sisestage lehe ülaossa kohe kehatähise järele:


Ja pärast kogu sisu kirjutamist sulgege see silt lehe kõige lõpus:


Siis, kui olete "noprindi" divi sulgenud, avage veel üks div koos sõnumiga, mida soovite dokumendi printimisel kuvada:


Seda lehte on ette nähtud võrgus vaatamiseks ja seda ei pruugi printida. Vaadake seda lehte aadressil http://webdesign.lifewire.com/od/advancedcss/qt/block_print.htm



Lisage link printimise CSS-dokumendile print.css:


Ja see dokument sisaldab järgmisi stiile:

#noprint {kuva: puudub; }
#print {display: block; }

Lõpuks oma standardses stiililehes (või sisemine stiil dokumendipeas), kirjutage:

#print {kuva: puudub; }
#noprint {display: block; }

See tagab, et prinditeade kuvatakse ainult prinditud lehel, samal ajal kui veebileht ilmub ainult võrgulehel.

Võtke arvesse kasutajakogemust

Veebilehtede printimine on üldjuhul halb kogemus, kuna tänapäeva saidid ei tõlgita prinditud lehele sageli hästi. Kui te ei soovi printimisstiilide dikteerimiseks luua täiesti eraldi stiililehte, võite kaaluda lehel printimise "väljalülitamiseks" selle artikli juhiste kasutamist. Olge teadlik selle mõjust, mida see võib avaldada kasutajatele, kes toetuvad veebisaitide printimisele (võib-olla seetõttu, et neil on nii) kehv nägemus ja võitlus ekraanil kuvatava teksti lugemise vastu) ning tehke otsuseid, mis teie saidi jaoks sobivad publik.

Jennifer Krynini originaalartikkel. Toimetanud Jeremy Girard.

instagram story viewer