Sådan blokeres en webside fra udskrivning med CSS

click fraud protection

web sider er beregnet til at blive set på en skærm. Mens der er en bred vifte af mulige enheder, der kan bruges til at se et websted (desktops, laptops, tablets, telefoner, wearables, tv osv.), de indeholder alle en skærm af en slags. Der er en anden måde nogen kan se dit websted på, en måde der ikke inkluderer en skærm. Vi henviser til en fysisk udskrift af dine websider.

For mange år siden ville du finde ud af, at folk, der udskriver websteder, var et ret almindeligt scenario. Vi husker, at vi mødtes med mange kunder, der var nye på nettet og følte sig mere komfortable med at gennemgå udskrevne sider på webstedet. De gav os derefter feedback og redigeringer på disse stykker papir i stedet for at se på skærmen for at diskutere hjemmesiden. Efterhånden som folk er blevet mere komfortable med skærmene i deres liv, og efterhånden som disse skærme er blevet multipliceret mange gange har vi set færre og færre mennesker forsøge at udskrive websider på papir, men det gør det stadig ske. Det kan være en god idé at overveje dette fænomen, når du planlægger dit websted. Vil du have folk til at udskrive dine websider? Måske gør du det ikke. Hvis det er tilfældet, har du nogle muligheder.

instagram viewer

Sådan blokeres en webside fra udskrivning med CSS

Det er let at bruge CSS for at forhindre folk i at udskrive dine websider. Du skal blot oprette et 1 linjestilark med navnet "print.css", der inkluderer følgende linje af CSS.

body {display: none; }

Denne ene stil vender "body" -elementet på dine sider til vises ikke - og da alt på dine sider er et underordnet element i kroppen, betyder det, at hele siden / webstedet ikke vises.

Når du har din "print.css" typografiark, vil du indlæse den i din HTML som et udskrivningsark. Sådan gør du det - bare tilføj følgende linje til "head" -elementet på dine HTML-sider.


Disse oplysninger fortæller browseren, at hvis denne webside er indstillet til at udskrive, skal den bruge dette typografiark i stedet for det standardformatark, som siderne bruger til skærmvisning. Når siderne skifter til dette "print.css" -ark, vil den stil, der gør, at hele siden ikke vises, sparke ind, og alt, hvad der udskrives, ville være en tom side.

Bloker en side ad gangen

Hvis du ikke har brug for at blokere mange sider på dit websted, kan du blokere udskrivning side for side med følgende typografier indsat i hovedet på din HTML.


Denne stil på siden ville have en højere specificitet end nogen typografier i din eksterne stilark, hvilket betyder, at siden slet ikke udskrives, mens andre sider uden denne linje stadig udskrives normalt.

Bliv bedre med dine blokerede sider

Hvad hvis du vil blokere for udskrivning, men ikke ønsker, at dine kunder bliver frustrerede? Hvis de ser en tom side udskrive, kan de blive ked af det og tro, at deres printer eller computer er ødelagt og ikke er klar over, at du i det væsentlige har deaktiveret udskrivning!

For at undgå besøgende frustration, kan du blive lidt mere avanceret og indsætte en besked, der kun vises, når dine læsere udskriver siden - og erstatter det andet indhold. For at gøre dette skal du oprette din standardwebside og øverst på siden lige efter body-tag sætte:


Og luk det mærke, når alt dit indhold er skrevet, nederst på siden:


Derefter, når du har lukket div. "Noprint", åbn en anden div med den besked, du vil have vist, når dokumentet udskrives:


Denne side er beregnet til at blive vist online og kan ikke udskrives. Se denne side på http://webdesign.lifewire.com/od/advancedcss/qt/block_print.htm



Inkluder et link til dit udskrevne CSS-dokument med navnet print.css:


Og i dette dokument inkluderer du følgende stilarter:

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

Endelig i dit standardformatark (eller i en intern stil i dit dokumenthoved), skriv:

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

Dette vil sikre, at udskrivningsmeddelelsen kun vises på den udskrevne side, mens websiden kun vises på online-siden.

Overvej brugeroplevelsen

Udskrivning af websider er generelt en dårlig oplevelse, da nutidens websteder ofte ikke oversættes godt til den udskrevne side. Hvis du ikke ønsker at oprette et helt separat typografiark til at diktere udskrivningsformater, kan du overveje at bruge trinnene i denne artikel til at "deaktivere" udskrivning på en side. Vær opmærksom på, hvilken indvirkning dette kan have på brugere, der er afhængige af udskrivning af websteder (måske fordi de har det) dårlig vision og kamp med at læse tekst på skærmen) og træffe beslutninger, der fungerer for dit websteds publikum.

Original artikel af Jennifer Krynin. Redigeret af Jeremy Girard.

instagram story viewer