Hvordan blokkere en webside fra utskrift med CSS

click fraud protection

nettsider er ment å bli sett på en skjerm. Mens det er et bredt utvalg av mulige enheter som kan brukes til å se et nettsted (stasjonære datamaskiner, bærbare datamaskiner, nettbrett, telefoner, bærbare enheter, TV-er osv.), inkluderer de alle en skjerm av noe slag. Det er en annen måte noen kan se på nettstedet ditt, en måte som ikke inkluderer en skjerm. Vi viser til en fysisk utskrift av websidene dine.

For mange år siden vil du oppdage at folk som skriver ut nettsteder var et ganske vanlig scenario. Vi husker at vi møtte mange kunder som var nye på nettet og følte seg mer komfortable med å gjennomgå trykte sider på nettstedet. De ga oss deretter tilbakemeldinger og redigeringer på papirene i stedet for å se på skjermen for å diskutere nettstedet. Etter hvert som folk har blitt mer komfortable med skjermene i livet, og etter hvert som skjermene har blitt mange mange ganger har vi sett færre og færre mennesker som prøver å skrive ut websider på papir, men det gjør det fortsatt skje. Det kan være lurt å vurdere dette fenomenet når du planlegger nettstedet ditt. Vil du at folk skal skrive ut nettsidene dine? Kanskje du ikke gjør det. Hvis det er tilfelle, har du noen alternativer.

instagram viewer

Hvordan blokkere en webside fra utskrift med CSS

Det er enkelt å bruke CSS for å forhindre at folk skriver ut websidene dine. Du trenger bare å lage et stillinje med 1 linje kalt "print.css" som inkluderer følgende linje med CSS.

body {display: none; }

Denne stilen vil gjøre "body" -elementet på sidene dine til vises ikke - og siden alt på sidene dine er et barn av kroppselementet, betyr dette at hele siden / nettstedet ikke vises.

Når du har "print.css" stilarket, vil du laste det inn i HTML som et utskriftsark. Slik gjør du det - bare legg til følgende linje i "head" -elementet på HTML-sidene dine.


Denne informasjonen forteller nettleseren at hvis denne websiden er satt til å skrives ut, skal du bruke dette stilarket i stedet for hvilket standardformatark som sidene bruker til skjermvisning. Når sidene bytter til dette "print.css" -arket, vil stilen som gjør at hele siden ikke vises, sparke inn, og alt som skrives ut vil være en tom side.

Blokker en side om gangen

Hvis du ikke trenger å blokkere mange sider på nettstedet ditt, kan du blokkere utskrift side for side med følgende stiler limt inn i HTML-hodet.


Denne stilen på siden vil ha en høyere spesifisitet enn noen stiler i din eksterne stilark, noe som betyr at siden ikke skrives ut i det hele tatt, mens andre sider uten denne linjen fortsatt vil skrives ut normalt.

Bli bedre med blokkerte sider

Hva om du vil blokkere utskrift, men ikke vil at kundene dine skal bli frustrerte? Hvis de ser ut som en tom side, kan de bli opprørt og tro at skriveren eller datamaskinen er ødelagt og ikke er klar over at du egentlig har deaktivert utskrift!

For å unngå besøkende frustrasjon, kan du bli litt mer avansert og legge inn en melding som bare vises når leserne dine skriver ut siden - og erstatter det andre innholdet. For å gjøre dette, bygg din standard webside, og sett øverst på siden, rett etter body-taggen:


Og lukk den koden etter at alt innholdet ditt er skrevet, helt nederst på siden:


Etter at du har lukket divisjonen "noprint", åpne en annen div med meldingen du vil vise når dokumentet skrives ut:


Denne siden er ment å vises online og kan ikke skrives ut. Vennligst se denne siden på http://webdesign.lifewire.com/od/advancedcss/qt/block_print.htm



Inkluder en lenke til utskrevet CSS-dokument med navnet print.css:


Og i dette dokumentet inkluderer du følgende stiler:

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

Til slutt, i standard stilark (eller i en intern stil i dokumenthodet), skriv:

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

Dette vil sikre at utskriftsmeldingen bare vises på den utskrevne siden, mens websiden bare vises på den elektroniske siden.

Tenk på brukeropplevelsen

Skrive ut nettsider er generelt en dårlig opplevelse siden dagens nettsteder ofte ikke oversettes godt til den trykte siden. Hvis du ikke ønsker å lage et helt eget stilark for å diktere utskriftsstiler, kan du vurdere å bruke trinnene i denne artikkelen for å "slå av" utskrift på en side. Vær oppmerksom på hvilken innvirkning dette kan ha på brukere som er avhengige av å skrive ut nettsteder (kanskje fordi de har det dårlig syn og problemer med å lese tekst på skjermen) og ta avgjørelser som vil fungere for nettstedets publikum.

Original artikkel av Jennifer Krynin. Redigert av Jeremy Girard.

instagram story viewer