Nur einen bestimmten Teil der Webseite ausdrucken

Diskutiere Nur einen bestimmten Teil der Webseite ausdrucken im CSS Forum im Bereich Programmierung; Moin, ich möchte nur einen Teil des Contents des Body meiner Webseite für den Ausdruck zulassen. Dazu habe ich schon Hilfe gefunden, die aber...
  • Nur einen bestimmten Teil der Webseite ausdrucken Beitrag #1
A
ASenna
Member
Beiträge
7
Punkte Reaktionen
0
Moin, ich möchte nur einen Teil des Contents des Body meiner Webseite für den Ausdruck zulassen. Dazu habe ich schon Hilfe gefunden, die aber leidern nicht klappt. Mein CSS:

CSS:
@media screen{
        body #druckbereich {
            color: blue;
            font-style: italic;
        }
    }
    @media print{
        body * {
            display: none;
        }
        body #druckbereich {
            display: block;
            color: green;
            font-style: italic;
        }
    }

Der Eintrag @media screen dient nur dazu, sicherzustellen, dass der in DIV eingefasste Text richtig erfasst wird, was auch klappt. Alles schön in blau und kursiv auf dem Bildschirm. Im Ausdruck erscheint aber nur eine leere Seite.
Kommentriere ich den body * {...} Befehl aus, wird im Ausdruck der zu drukcende Text, der mit <DIV id="druckbereich"> eingefasst ist, auch brav in grün ausgedruckt, zusätzlich natürlich der ganze Rest der Seite.

Also: body * {...} sperrt offensichtlich den nachfolgenden CSS-Befehle. Kann mir da jemand helfen?.
 
  • Nur einen bestimmten Teil der Webseite ausdrucken Beitrag #2
T
tk1234
Well-known member
Beiträge
103
Punkte Reaktionen
8
Moin, ich möchte nur einen Teil des Contents des Body meiner Webseite für den Ausdruck zulassen.
Dass du es nicht wirklich verhindern kannst dass Besucher Seiten ausdrucken ist dir hoffentlich klar.

CSS:
@media screen{
        body #druckbereich {
            color: blue;
            font-style: italic;
        }
    }
Hier fehlt die Angabe einer Hintergrundfarbe - sonst kann es passieren dass die Textfarbe auf der verwendeten Hintergrundfarbe nicht lesbar ist.
Also: body * {...} sperrt offensichtlich den nachfolgenden CSS-Befehle. Kann mir da jemand helfen?.
CSS-Befehle gibt es schon mal gar nicht da CSS keine Programmiersprache ist - aber mit »body #druckbereich« blendest du zwar dieses eine Element wieder ein, »body *« wirkt aber auch auf alle Kindelemente von #druckbereich die weiterhin ausgeblendet sind. Je nachdem wie dein HTML aussieht, könnte ein Kindselektor hilfreich sein, evtl. auch in Kombination mit :not().
 
  • Nur einen bestimmten Teil der Webseite ausdrucken Beitrag #3
A
ASenna
Member
Beiträge
7
Punkte Reaktionen
0
Dass du es nicht wirklich verhindern kannst dass Besucher Seiten ausdrucken ist dir hoffentlich klar.
Danke für den Hinweis. Vorliegend geht es mir nur um das Sparen von Papier.
 
  • Nur einen bestimmten Teil der Webseite ausdrucken Beitrag #4
A
ASenna
Member
Beiträge
7
Punkte Reaktionen
0
Ich habe das jetzt mal ausprobiert. Geändert hat sich leider nichts, wobei mir schon klar ist, warum.

CSS:
@media print{
        body * {
            display: none;
        }
        body > em {
            display: block !important;
            color: green;
            background-color: #FFFFFF;
            font-style: italic;
        }
    }

Der auszudruckende Text ist eingefasst in <em> ... </em>. Das em-Element ist aber kein direktes Kind von body. Unser Theme knallt da noch einige DIV dazwischen.
 
  • Nur einen bestimmten Teil der Webseite ausdrucken Beitrag #5
A
ASenna
Member
Beiträge
7
Punkte Reaktionen
0
»body *« wirkt aber auch auf alle Kindelemente von #druckbereich
Wenn >body *< auf alle seine Kinder und Kindeskinder durchschlägt, kann man das dem <DIV class="druckbereich"> für seine Kinder und Kindeskinder nicht auch mitgeben?
 
  • Nur einen bestimmten Teil der Webseite ausdrucken Beitrag #6
T
tk1234
Well-known member
Beiträge
103
Punkte Reaktionen
8
Wenn >body *< auf alle seine Kinder und Kindeskinder durchschlägt, kann man das dem <DIV class="druckbereich"> für seine Kinder und Kindeskinder nicht auch mitgeben?
Ungetestet: »body #druckbereich *« - allerdings kannst du display nicht pauschal auf block setzen, sinnvoller wäre es aber wohl mit :not() zu arbeiten.
 
Thema:

Nur einen bestimmten Teil der Webseite ausdrucken

Oben Unten