Textauszeichnung für Spezielle Zwecke

Link

Der <a>-Tag wird verwendet, um Hyperlinks zu erstellen, die es Benutzern ermöglichen, zwischen verschiedenen Webseiten zu navigieren. Wenn ein Benutzer auf einen Link klickt, sendet der Browser eine Anfrage an den Server für die mit dem Link verknüpfte Seite und zeigt die Antwort auf dem Bildschirm an. Das href-Attribut hilft, die URL der Zielseite anzugeben.

index.html

Link-Attribute

target

Standardmäßig wird der Link im selben Browser-Tab geöffnet. Das target-Attribut ermöglicht es uns, dieses Verhalten zu ändern. Um einen Link in einem neuen Tab zu öffnen, verwenden Sie target="_blank".

index.html

download

Das download-Attribut kann mit dem HTML-<a>-Tag verwendet werden, um anzugeben, dass die Zielressource heruntergeladen werden soll, anstatt im Browser angezeigt zu werden. Wenn das download-Attribut verwendet wird, fordert der Browser den Benutzer auf, die Datei mit dem angegebenen Dateinamen zu speichern. Zum Beispiel, wenn Sie ein Element mit der folgenden Funktionalität erstellen müssen: Wenn der Benutzer auf den Link klickt, lädt der Browser die Datei "myfile.pdf" von https://example.com/ herunter und fordert den Benutzer auf, sie mit dem Dateinamen myfile.pdf zu speichern.

index.html

href

Das href-Attribut wird nicht nur verwendet, um zu anderen Seiten zu navigieren, sondern auch, um Links zu E-Mail-Adressen, Telefonnummern und bestimmten Abschnitten zu erstellen.

index.html

Zusätzlich kann das href-Attribut verwendet werden, um zu bestimmten Abschnitten innerhalb einer Webseite zu navigieren. Um ein Anker-Tag zu erstellen, weisen Sie dem gewünschten Abschnitt, zu dem wir scrollen möchten, ein id-Attribut (einen eindeutigen Bezeichner) zu. Das href-Attribut nimmt einen Wert an, der mit dem #-Symbol beginnt, gefolgt vom id-Wert.

Lassen Sie uns das folgende Beispiel erkunden, das in Form von CodeSandbox präsentiert wird. Diese Plattform ermöglicht die Code-Inspektion und erlaubt es Ihnen, die Funktionalität des Codes zu untersuchen.

Hinweis

Bitte nehmen Sie sich einen Moment Zeit, um die Funktionalität zu überprüfen, indem Sie auf die Links klicken und beobachten, wie die Live-Seite zu den spezifischen Abschnitten scrollt. Achten Sie außerdem auf die Attribute des a-Tags und des h2-Tags.

Um den Code anzuzeigen, ziehen Sie den Schieberegler auf der linken Seite des Code-Sandkastens. Dadurch wird der vorhandene Code im Editor sichtbar.

Button

Das <button>-Tag in HTML wird verwendet, um einen klickbaren Button zu erstellen, der eine Aktion auslösen kann, wie z.B. das Absenden eines Formulars, das Ausführen einer JavaScript-Funktion wie das Öffnen und Schließen eines Pop-up-Fensters oder das Umschalten eines mobilen Menüs. Standardmäßig hat das <button>-Tag das type-Attribut, und sein Wert ist submit. Oftmals müssen Sie jedoch type="button" angeben.

index.html

Zusammenfassung

Der <a>-Tag wird verwendet, um Hyperlinks zu anderen Webseiten, Dokumenten oder Ressourcen zu erstellen. Im Gegensatz dazu wird der <button>-Tag verwendet, um Interaktivität auf einer Webseite zu schaffen, ein Ereignis auszulösen oder eine Aktion auszuführen. Es ist wichtig, ihre Zwecke nicht zu vermischen.