CSS (cascading style sheets) geeft u aanzienlijke controle over hoe inhoud op uw webpagina's op het scherm wordt weergegeven. Dit besturingselement strekt zich ook uit tot andere media, zoals wanneer de webpagina wordt afgedrukt.
U vraagt zich misschien af waarom u een print functie naar uw webpagina; de meeste mensen weten immers al of kunnen er gemakkelijk achter komen hoe ze een webpagina kunnen afdrukken via de menu's van hun browser.
Maar er zijn situaties waarin het toevoegen van een printknop of koppeling naar een pagina zal niet alleen het proces gemakkelijker maken voor uw gebruikers wanneer ze een pagina moeten afdrukken maar, misschien nog wel belangrijker, geven u meer controle over hoe die afdrukken zullen verschijnen papier.
Hier leest u hoe u printknoppen of printlinks op uw pagina's kunt toevoegen en hoe u kunt definiëren welke delen van uw pagina-inhoud worden afgedrukt en welke niet.
Een afdrukknop toevoegen
U kunt eenvoudig een afdrukknop aan uw webpagina toevoegen door de volgende code toe te voegen aan uw HTML-document waar u de knop wilt laten verschijnen:
onclick = "window.print (); return false;" />
De knop wordt gelabeld als Print deze pagina wanneer het op de webpagina verschijnt. U kunt deze tekst naar wens aanpassen door de tekst tussen de volgende aanhalingstekens te wijzigen
waarde =in de bovenstaande code.
Merk op dat er een enkele lege spatie voor de tekst staat en deze volgt; dit verbetert het uiterlijk van de knop door wat ruimte in te voegen tussen de uiteinden van de tekst en de randen van de weergegeven knop.
Een printlink toevoegen
Het is nog eenvoudiger om een simpele printlink aan uw webpagina toe te voegen. Plaats gewoon de volgende code in uw HTML-document waar u de link wilt laten verschijnen:
afdrukken
U kunt de linktekst aanpassen door "print" te veranderen in wat u maar wilt.
Specifieke secties afdrukbaar maken
U kunt de mogelijkheid voor gebruikers instellen om specifieke delen van uw webpagina af te drukken met een afdrukknop of -link. U kunt dit doen door een print.css bestand naar uw site, noem het in de kop van uw HTML-document en definieer vervolgens de secties die u gemakkelijk afdrukbaar wilt maken door een klasse te definiëren.
Voeg eerst de volgende code toe aan het hoofdgedeelte van uw HTML-document:
type = "text / css" media = "print" />
Maak vervolgens een bestand met de naam print.css. Voeg in dit bestand de volgende code toe:
body {zichtbaarheid: verborgen;}
.print {zichtbaarheid: zichtbaar;}Deze code definieert alle elementen in de body als verborgen tijdens het afdrukken, tenzij aan het element de klasse "print" is toegewezen.
Nu hoeft u alleen nog maar de klasse "print" toe te wijzen aan de elementen van uw webpagina die u wilt afdrukken. Als u bijvoorbeeld een sectie gedefinieerd in een div-element afdrukbaar wilt maken, gebruikt u
Al het andere op de pagina dat niet aan deze klasse is toegewezen, wordt niet afgedrukt.