Zum Inhalt springen

Druckansicht einfach gemacht, aber wie?

Erstellt am 24. August 2007 · 3 Antworten · letzte Antwort am 24. August 2007

Tags: Frage

sani06 ·

Hallo!

Ich brauche für meine Seiten eine Druckansicht, habe aber noch nie eine gemacht und keine Ahnung wie es geht.

Ich habe einen Menüpunkt "Seite drucken" in meinem Menü. Jetzt soll sich aber nicht mehr eine neue Seite öffnen sonddern ein Fenster mit der Druckansicht welche ich dann ausdrucken kann.

Kann man das überhaupt so machen oder muss ich einen Marker setzen?

Danke, sani!

ehontheim ·

Hallole!

Zum Thema Druckstylesheet wie von Wunschtacho vorgeschlagen:

Unter der Voraussetzung, dass du dein gesamtes Layout sauber mit CSS steuerst, dann kannst du die Anweisung @media verwenden. Beispiel:

@media all { hier folgen CSS-Anweisungen für alle Darstellungen }
@media screen { hier folgen CSS-Anweisungen nur für Bildschirm}
@media print { hier folgen CSS-Anweisungen nur für Drucker}

Der Explorer verwendet dann abhängig die CSS-Anweisungen gemäß @media.

Wenn der Betrachter ganz normal in seinem Explorer auf Drucken oder Druckvorschau klickt, dann würden die Anweisungen in @media all UND @media print verwendet. Du kannst jetzt also gezielt die Darstellung für den Druck anpassen, in dem du Teile, die nicht gedruckt werden sollen, mit display:none; ausblendest. Oder du z.B. die Spalte maincontent statt wie in der Bildschirmdarstellung mit margin-left:200px; jetzt mit margin-left:0px; verwendest, da du ja die Spalte menuleft gerade ausgeblendet hast. Oder du verwendest Schriftarten, die für den Druck besser passen als für den Bildschirm.

@media print {
body * {font-size:12pt; font-family:"Times New Roman", Times, serif; color:000000;}
#header {display:none;}
#footer {display:none;}
#menuleft {display:none;}
#maincontent {margin:0; padding:0; border:0; ..etc..}

.....
}

und so weiter und so heiter
}

Das funktioniert wunderbar. Dafür bekommt der Betrachter allerdings keinen Button "Druckversion" angezeigt #paralyzed#

Grüße

Erwin

einpraegsam.​net ·
ehontheim schrieb

Das funktioniert wunderbar. Dafür bekommt der Betrachter allerdings keinen Button "Druckversion" angezeigt #paralyzed#

Klar, einfach einen Link mit JS erstellen...