Gem Elementer Ved Udskrift

I denne artikel vil jeg forklare lidt om at gemme elementer ved udskrivning.

Lad os lige kigge på dette eksempel en gang, jeg fortæller nærmere bagefter.

@media print {
	.no-print, .no-print * {
		display:none !important;
	}
}

@media reffererer til hvilket medie det omhandler, i dette tilfælde er det "print", som så er udskrifter.

.no-print er den class i CSS, som skal gemmes.

Et komma er lig med "og", stjerne betyder alt, ved at definere ".no-print *", så betyder det at det også gælder alle elementer under ".no-print".

display:none; er en metode til at vise eller skjule HTML elementer, hvor "!important" bare fortæller at den ikke er vigtig.

Et lille eksempel på HTML-delen.

<div class="no-print">
	Dette bliver ikke vist på et udskrift
</div>

Ved at kombinere HTML og CSS eksemplerne her fra, så kan du udskrive dine hjemmesider uden at have alt muligt ekstra, som kan være unødvendigt.