Elemente beim Drucken von Webseiten ausblenden
Viele Menschen benötigen die Möglichkeit, Webseiten zu drucken, finden es jedoch möglicherweise unpraktisch, wenn Elemente auf der Seite, wie z Schaltflächen, Navigationsleisten oder andere Komponenten werden im Ausdruck angezeigt. Dies kann zu einer Ablenkung führen und das gedruckte Dokument unübersichtlich machen. Um dieses Problem auszuräumen, beschäftigen wir uns mit einer Lösung, die es Ihnen ermöglicht, bestimmte Elemente während des Druckvorgangs auszublenden.
Elemente über CSS ausblenden
Eine effektive Methode zum Ausblenden von Elementen Beim Drucken werden CSS-Regeln (@media print) verwendet. Durch die Einbindung des folgenden Codes in Ihr Stylesheet können Sie diesen Effekt erzielen:
@media print { .no-print, .no-print * { display: none !important; } }
Dieser Code erstellt eine CSS-Regel, die für den Medientyp „Drucken“ gilt. Innerhalb dieser Regel werden alle HTML-Elemente mit der Klasse „no-print“ sowie alle darin enthaltenen untergeordneten Elemente beim Drucken ausgeblendet.
Anwenden der Klasse „no-print“
Um ein Element während des Druckens auszublenden, fügen Sie einfach die Klasse „no-print“ zu seinem HTML-Code hinzu. Dies kann inline, innerhalb des öffnenden Tags des Elements oder innerhalb einer vorhandenen Klassenanweisung erfolgen. Wenn Sie beispielsweise eine Schaltfläche mit dem folgenden HTML-Code haben:
<button>Print</button>
Sie können sie während des Druckens ausblenden, indem Sie sie ändern in:
<button>
Beispiel im Kontext
Stellen Sie sich das folgende Szenario vor:
"Good Evening" Print (click Here To Print)
Um die Beschriftung „Drucken“ beim Drucken des Textes auszublenden „Guten Abend“, fügen Sie die Klasse „no-print“ zum HTML der Schaltfläche hinzu:
"Good Evening" <button>
Auf diese Weise wird die Beschriftung „Drucken“ während des Druckens ausgeblendet, was zu einem saubereren und fokussierteren Ausdruck führt .
Das obige ist der detaillierte Inhalt vonWie kann ich unerwünschte Webseitenelemente beim Drucken ausblenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!