Selcuk: print / nicht alles drucken

Hallo Leute,

ich habe ein Problem mit dem drucken einer HTML Seite.

Ich möchte das der Text der ganz oben auf der Seite steht und das einige Grafiken nicht gedruckt werden.

Ich weiss, dass dieser Befehl:

@media print{
img{display:none;}
}

alle grafiken ausschaltet.

Und dass dieser hier:

@media print{
img.nichtdrucken{display:none;}
}

nur die ausschaltet mit class=nichtdrucken.
Aber das klappt bei mir nicht. Ich glaube, dass ich den class an die falsche Stelle setzte.

In welchen Tag muss ich class setzen damit es funktioniert, oder ist das was falsch?
Und wie mache ich das, dass er Texte nicht druckt?

Viele Grüße
Selcuk

  1. Hi,

    Das, was Du machst, bezieht sich nur auf die Grafiken. <img src="" class="nichtdrucken"> druckt diese Grafiken nicht mehr aus.

    Da Du aber anscheinend auch text nicht mitdrucken willst, ändere Dein CSS wie folgt ab:

    @media print{
    .nichtdrucken{display:none;}
    }

    Füge überall da, was nicht gedruckt werden soll, ein class="nichtdrucken". Einzelen Worte kannst Du z.B. mit <div>s oder <span>s ausschließen.

    Bsp:

    <p>Hallo, das ist ein lustiger Text. <span class="nichtdrucken">ich werde nicht gedruckt.</span> Ich hingegen schon.</p>

    Viel Erfolg...

    Alex (:

    1. Hi,

      danke. Probiere ich gleich aus.

      Bis dann.

      Selcuk

    2. Danke hat funktioniert.

      Weiss du vielleicht auch, wie ich die Kopf- und Fußzeilen beim Ausdruck direkt ausschalten kann. Das soll nicht mitgedruckt werden.

      Danke.
      Selcuk Günes

      1. Moin!

        Weiss du vielleicht auch, wie ich die Kopf- und Fußzeilen beim Ausdruck direkt ausschalten kann. Das soll nicht mitgedruckt werden.

        Beim Drucken geht ein Dialogfenster auf, welches diese Einstellungen ermöglicht.

        Generell und allgemein per CSS läßt sich darauf keinerlei Einfluß nehmen.

        - Sven Rautenberg

      2. Weiss du vielleicht auch, wie ich die Kopf- und Fußzeilen beim Ausdruck direkt ausschalten kann. Das soll nicht mitgedruckt werden.

        http://www.misitio.ch/ie/ie6/ie6einstellungen.html#1300

    3. Kann man auch den Bereich festlegen der gedruckt werden soll, anstatt dem der _nicht_ gedruckt werden soll?

      Es sollte zum Beispiel von mehreren ineinander verschachtelten Tabellen nur eine Zelle mit Inhalt ausgedruck werden - da wäre das ja viel einfacher, wenn man eine class für den Bereich festlegen könnte, der gedruckt werden soll!? Geht das?

      Grüße,
      sunny

      1. Hi,

        Es sollte zum Beispiel von mehreren ineinander verschachtelten Tabellen nur eine Zelle mit Inhalt ausgedruck werden - da wäre das ja viel einfacher, wenn man eine class für den Bereich festlegen könnte, der gedruckt werden soll!? Geht das?

        Soweit ich weiß geht dies nicht ganz ohne Arbeit. Das Problem ist, daß CSS zwar Möglichkeiten bietet, Elemente auszublenden, es verfügt aber über keine Möglichkeiten der Umkehrung. Also man kann nicht pauschal alle Elemente bis auf ein paar ausblenden.

        An sich macht dies ja auch wenig Sinn (;
        Denn wenn ich Elemente nicht haben möchte, verstecke ich sie ja nicht, sondern lasse sie einfach weg...

        Nun gut, wie auch immer...
        Du kannst es so machen:

        @media print{
        table, td, tr, p { display: none; }
        .drucken { display: block; }
        }

        In der zweiten Zeile (da, wo "table, tr, td..." steht) trägst Du alle Tags ein, die Du ausblenden möchtest. Bitte verwende nicht body, da sonst alles ausgelendet wird, ohne Ausnahmen.

        Alle Elemente, die gedruckt werden sollen, weist Du die Klasse "drucken" zu, z.b. so: <p>Ich werde nicht gedruckt. <span class="drucken">Ich schon.</span> Ich werde auch nicht gedruckt.</p>

        Grüße...

        Alex (:

        1. Danke für die Idee - habs grad versucht, jetzt wird aber gar nichts mehr gedruckt.

          @media print{
          table, td, tr, p { display: none; }
          .print { display: block; }
          }

          Und in der Html-Datei:

          ...
          <span class="print">
          <table>
          ...
          </table>
          </span>
          ...

          Das heißt, diese eine Tabelle soll gedruckt werden. Was ist hier falsch?

          Lg,
          sunny

          1. Moin!

            @media print{
            table, td, tr, p { display: none; }
            .print { display: block; }
            }

            Und in der Html-Datei:

            ...
            <span class="print">
            <table>
            ...
            </table>
            </span>
            ...

            Das heißt, diese eine Tabelle soll gedruckt werden. Was ist hier falsch?

            Ist doch logisch: Du willst ein <span> angezeigt haben und die enthaltene Tabelle nicht anzeigen - so ist es im CSS definiert.

            Andersrum klappts auch nicht:
            <table><tr>
            <td><span class="print">Das wird trotzdem nicht gezeigt</span></td>
            </tr></table>

            Das Beste ist, wenn du dir _vorher_ überlegst, was du auf dem Bildschirm, und was du auf dem Papier haben willst, all diesen Elementen dann irgendeine Klasse oder ID gibst (die Klassen müssen nicht immer dieselben sein), und zwei Stylesheets anlegst:

            screen.css:
            #navigation {formatierungen}
            .klasse1 {formatierungen}
            .klasse2 {formatierungen}
            .klasse3 {formatierungen}
            .druckhinweis {display:none;}

            print.css:
            #navigation {display:none;}
            .klasse1 {display:none;}
            .klasse2 {formatierungen}
            .klasse3 {display:none;}
            .druckhinweis {formatierungen}

            Wenn du jedem Element auf der Seite eine Sinnbedeutung gibst, kannst du anhand dieser Bedeutung viel leichter entscheiden: Soll das Element auf dem Bildschirm erscheinen? Soll es beim Druck erscheinen? Wie soll es jeweils aussehen?

            Am Beispiel: Die ID "navigation" ist vielleicht ein Layer mit der (Haha!) Navigation. Die wird nicht mitgedruckt. "klasse1" könnte für Bilder da sein - wird ebenfalls nicht gedruckt. "klasse2" wird auf Bildschirm und Papier ausgegeben, "klasse3" wieder nur auf den Bildschirm. Die Klasse "druckhinweis" dagegen wird am Bildschirm nicht angezeigt und könnte irgendeinen Hinweis enthalten, der nur beim Drucken sichtbar ist.

            Ach ja: Was bei Druck-Stylesheets Sinn macht: Schwarze Schriftfarbe einstellen, weiße Hintergrundfarbe. Man muß nicht unbedingt bunt drucken. Links sollten, sofern sie denn im Fließtext stehen, ohne Unterstreichung und am besten auch ohne farbliche Hervorhebung gedruckt werden - auf Papier kann man sie nicht anklicken, die Hervorhebung würde aber den Lesefluß stören.

            - Sven Rautenberg

            1. Das Problem ist aber, dass ich mehrere ineinander verschachtelte Tabellen habe, aber nur eine davon soll ausgedruckt werden. Wenn ich jetzt also zB. eine Klasse für table hab, bezieht sich ja das wieder auf alle Tabellen!?

              Lg,
              sunny

              1. Das Problem ist aber, dass ich mehrere ineinander verschachtelte Tabellen habe, aber nur eine davon soll ausgedruckt werden. Wenn ich jetzt also zB. eine Klasse für table hab, bezieht sich ja das wieder auf alle Tabellen!?

                Sicher, sonst würde die table-Angabe ja keinen Sinn machen und ich kann mit selbst defnierten Klassen arbeiten.

                Du kannst zum einen nur den Inhalt der Tabelle druckbar machen. Also den reinen Text und nicht die Tabllenzelle.

                Zum anderen kannst Du auch eine zweite table-Klasse definieren, die gedruckt werden soll.

                Bsp: table.drucken { display: block }

                Ich habe es bei mir so gelöst:

                <table>
                <tr>
                <td class="keindruck">
                   <table>
                    <tr>
                     <td>1. verschachtelte Tab.</td>
                    </tr>
                   </table>
                   <table>
                    <tr>
                     <td>2. verschachtelte Tab.</td>
                    </tr>
                   </table>
                </td>
                <td class="druck">
                   <table>
                    <tr>
                     <td>1. verschachtelte Tab. - wird gedruckt</td>
                    </tr>
                   </table>
                </td>
                </tr>
                </table>

                Viele Grüße...

                Alex :)