Per Holmbergs webbtips:

Automatisk utskriftsdesign med CSS

Många sidor har en länk till en utskriftsvänlig version av sidan. Det är bra. Men det är också ganska onödigt med moderna webbtekniker. Med CSS kan du specificera vilka designegenskaper som ska gälla för skärm och vilka som ska gälla för utskrift. Webbläsaren skiftar automatiskt "läge" vid utskrift.

Implementation

I (X)HTML-filerna länkar du in CSS-filen på vanligt sätt:

<link rel="stylesheet" type="text/css" href="minstil.css" media="all" />

Din CSS-fil bygger du upp så här:

@media screen {
/* CSS-kod för skärmläsning här */
}
@media print {
/* CSS-kod för utskrift här */
}

Oftast vill man inte har med navigeringen på utskriftsversionen. Man kan enkelt gömma delar av sidan. Om vi har ett område med klassen "nav" i (X)HTML-koden så kan vi gömma den genom:

.nav { display: none; }

Detta är bara ett exempel på de möjligheter som finns.

Webbläsarstöd

Alla de moderna webbläsare stödjer CSS efter media. IE har dock problem ibland. Följande rad, där funktionen är kombinerad med CSS import-direktiv, buggar IE ur på:

@import url("stil-utskrift.css") print;

Länkar

Förra tipset: Grafiska textknappar
© Per Holmberg [kontakt]. Sidan senast uppdaterad 2004-04-28. Till toppen av sidan