print css (nur bestimmten Bereich anzeigen)

freddy · #1 (**permalink**) 15.03.2004, 11:27

Hallo,

ich möchte bei der Druckansicht nur den Hauptteil darstellen. Die Menüs oben und unten sollen nicht sichtbar sein.

Hat jemand eine Ahnung wie ich das mit CSS realisieren kann?

Gruß

freddy

crock · #2 (**permalink**) 15.03.2004, 14:01

Hi freddy,

ein Print-CSS ist im Grunde nichts anderes als ein "normales" CSS, außer das es halt nur beim Drucken aktiv wird.

Damit der Browser weiß, dass es ein print-css ist, muss man dem Link zum CSS das Media-Attribut mit dem Wert "print" geben.

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

Das war jetzt schon mal der wichtigste Schritt. Der Rest ist ganz normales CSS. Wenn Du also Deine Menüs beim Druck nicht ausgeben möchtest, dann gibt es dafür eine recht einfache Lösung.

Code:

<div id="top-menu">
       Hier ist Dein Top-Menü
</div>
<div id="content">
       Hier stehen die Seiteninnhalte
</div>
<div id="bottom-menu">
       Hier ist Dein unteres Menü
</div>

Code:

/* print-css */
#top-menu, #bottom-menu{
   display:none;
}

In dem Beispiel oben siehst Du das die beiden Menüs in extra Div´s mit einer ID gelegt wurden. Das CSS macht jetzt nichts anderes als die Menüs auszublenden, so dass nur noch der eigentliche Inhalt der Seite bleibt.

Gruss

crock

freddy · #3 (**permalink**) 15.03.2004, 23:27

hallo,

vom Prinzip habe ich es verstanden. Bei mir ist es nur so das ich eine etwas umfangreichere Html-Datei mit ziemlich vielen Divs habe. Kann man nicht ein CSS machen das erstmal alles ausblendet und im nächsten Schritt nur ein einzelnes wieder einblendet?

Dann müsste ich nicht jedem einzelnen Div ein display:none geben.

Gruss

Freddy

crock · #4 (**permalink**) 16.03.2004, 09:37

stimmt, bei diesem Sachverhalt wäre das wirklich einfacher.

Code:

div{ /* blendet alle Divs aus */
display:none;
}

#content{ /* blendet Div mit der id content ein */
display:block;
}

so sollte es funktionieren.

freddy · #5 (**permalink**) 16.03.2004, 16:38

yippiee!

So gehts und das mit einer super kleinen CSS-Datei.

Danke Dir crock

Gruss

freddy

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Mehrere Bilder mit ordentlicher CSS Anweisung anzeigen	overflow	CSS	4	29.05.2010 18:20
css - scrollbarer Bereich?	timo_81	CSS	11	06.02.2005 09:41
Anzeigen der aktiven Seite mit CSS	mmirko	CSS	7	30.12.2004 15:28
Print CSS Tipps und tricks?	FlashJunior	CSS	5	03.12.2004 10:54
css für print	stronzo	CSS	1	04.12.2003 17:43