Wie kann ich Webseitenelemente beim Drucken ausblenden?

Elemente beim Drucken einer Webseite ausblenden

Beim Drucken einer Webseite ist es oft wünschenswert, bestimmte Elemente vom Ausdruck auszuschließen. Beispielsweise können Schaltflächen oder Links, die auf dem Bildschirm sichtbar sind, in der gedruckten Version erscheinen und ein unerwünschtes Durcheinander verursachen.

Lösung: CSS-Medienabfragen

CSS-Medienabfragen eine Lösung für dieses Problem anbieten. Durch die Anwendung spezifischer Stilregeln innerhalb einer Medienabfrage für das Medium „Drucken“ können Sie die Sichtbarkeit von Elementen basierend darauf steuern, ob gerade ein Ausdruck ausgeführt wird oder nicht.

Implementierung:

1. Erstellen Sie eine druckspezifische Stylesheet-Regel:

   Hinzufügen Fügen Sie Ihrem Stylesheet den folgenden Code hinzu:

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

   Diese Regel besagt, dass jedes Element mit der Klasse „no-print“ ausgeblendet wird, wenn sich der Browser im Druckmodus befindet.

2. Wenden Sie die No-Print-Klasse an:

   Fügen Sie in Ihrem HTML die „No-Print“-Klasse zu den Elementen hinzu, die Sie verbergen möchten während des Druckens. Zum Beispiel:

   <a class="no-print" href="#">Print (click Here To Print)</a>

Beispiel:

Das folgende Beispiel zeigt die Auswirkung der Klasse „no-print“ auf das Drucken:

"Good Evening"
<a class="no-print" href="#">Print (click Here To Print)</a>

Wenn ein Benutzer auf den Link „Drucken“ klickt, zeigt der Browser einen Ausdruck an, der nur den Text „Guten Abend“ enthält. Der Link „Drucken“ selbst wird ausgeblendet.

Das obige ist der detaillierte Inhalt vonWie kann ich Webseitenelemente beim Drucken ausblenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!