Fügen Sie eine Druckschaltfläche oder einen Link zu Ihrer Webseite hinzu

Mit CSS (Cascading Style Sheets) können Sie erheblich steuern, wie Inhalte auf Ihren Webseiten auf dem Bildschirm angezeigt werden. Dieses Steuerelement erstreckt sich auch auf andere Medien, z. B. wenn die Webseite gedruckt wird.

Sie fragen sich vielleicht, warum Sie eine hinzufügen möchten Druckfunktion zu Ihrer Webseite; Schließlich wissen die meisten Menschen bereits oder können leicht herausfinden, wie eine Webseite über die Menüs ihres Browsers gedruckt wird.

Es gibt jedoch Situationen, in denen eine Druckschaltfläche oder hinzugefügt wird Verknüpfung Das Aufrufen einer Seite erleichtert Ihren Benutzern nicht nur den Vorgang, wenn sie eine Seite ausdrucken müssen Aber vielleicht noch wichtiger ist, dass Sie mehr Kontrolle darüber haben, wie diese Ausdrucke angezeigt werden Papier.

Hier erfahren Sie, wie Sie Druckschaltflächen oder Drucklinks zu Ihren Seiten hinzufügen und definieren, welche Teile Ihres Seiteninhalts gedruckt werden und welche nicht.

Hinzufügen einer Druckschaltfläche

instagram viewer

Sie können Ihrer Webseite ganz einfach eine Druckschaltfläche hinzufügen, indem Sie Ihrem HTML-Dokument den folgenden Code hinzufügen, in dem die Schaltfläche angezeigt werden soll:

onclick = "window.print (); return false;" />

Die Schaltfläche wird als gekennzeichnet Drucke diese Seite wenn es auf der Webseite erscheint. Sie können diesen Text nach Ihren Wünschen anpassen, indem Sie den Text zwischen den folgenden Anführungszeichen ändern

Wert =
im obigen Code.
Beachten Sie, dass vor und nach dem Text ein einzelnes Leerzeichen steht. Dies verbessert das Erscheinungsbild der Schaltfläche, indem zwischen den Textenden und den Kanten der angezeigten Schaltfläche ein Leerzeichen eingefügt wird.

Hinzufügen eines Drucklinks

Es ist noch einfacher, Ihrer Webseite einen einfachen Drucklink hinzuzufügen. Fügen Sie einfach den folgenden Code in Ihr HTML-Dokument ein, in dem der Link angezeigt werden soll:

drucken

Sie können den Linktext anpassen, indem Sie "Drucken" auf eine beliebige Option ändern.

Bestimmte Abschnitte druckbar machen

Sie können festlegen, dass Benutzer bestimmte Teile Ihrer Webseite über eine Druckschaltfläche oder einen Link drucken können. Sie können dies tun, indem Sie a hinzufügen print.css Datei auf Ihrer Site, rufen Sie sie im Kopf Ihres HTML-Dokuments auf und definieren Sie dann die Abschnitte, die Sie durch Definieren einer Klasse einfach druckbar machen möchten.

Fügen Sie zunächst den folgenden Code zum Kopfbereich Ihres HTML-Dokuments hinzu:

type = "text / css" media = "print" />

Erstellen Sie als Nächstes eine Datei mit dem Namen print.css. Fügen Sie in dieser Datei den folgenden Code hinzu:

Körper {Sichtbarkeit: versteckt;}
.print {Sichtbarkeit: sichtbar;}

Dieser Code definiert alle Elemente im Hauptteil beim Drucken als ausgeblendet, es sei denn, dem Element ist die Klasse "print" zugewiesen.

Jetzt müssen Sie nur noch die Klasse "Drucken" den Elementen Ihrer Webseite zuweisen, die gedruckt werden sollen. Um beispielsweise einen in einem div-Element definierten Abschnitt druckbar zu machen, würden Sie verwenden

Alles andere auf der Seite, das dieser Klasse nicht zugeordnet ist, wird nicht gedruckt.