Heim > Web-Frontend > HTML-Tutorial > Beispiel-Tutorial zu HTML-Links

Beispiel-Tutorial zu HTML-Links

零下一度
Freigeben: 2017-06-24 13:50:48
Original
1268 Leute haben es durchsucht

HTML verwendet Hyperlinks, um eine Verbindung zu einem anderen Dokument im Web herzustellen. Links sind auf fast jeder Webseite zu finden. Klicken Sie auf einen Link, um von einer Seite zur anderen zu springen.



Ausprobieren - Beispiel

HTML-Link
So erstellen Sie einen Link in einem HTML-Dokument.

(Weitere Beispiele finden Sie unten auf dieser Seite)


HTML-Hyperlink (Link)

HTML verwendet das Tag Hypertext-Link.

Ein Hyperlink kann ein Wort, ein Wort, eine Wortgruppe oder ein Bild sein. Sie können auf diese Inhalte klicken, um zu einem neuen Dokument oder einem bestimmten Teil des aktuellen Dokuments zu springen.

Wenn Sie den Mauszeiger über einen Link auf der Webseite bewegen, verwandelt sich der Pfeil in eine kleine Hand.

Das href-Attribut wird im Tag verwendet, um die Adresse des Links zu beschreiben.

Standardmäßig werden Links im Browser wie folgt angezeigt:

  • Ein nicht besuchter Link wird in blauer Schrift und unterstrichen angezeigt.

  • Besuchte Links werden lila und unterstrichen angezeigt.

  • Wenn auf einen Link geklickt wird, wird dieser rot und unterstrichen angezeigt.

Hinweis: Wenn für diese Hyperlinks CSS-Stile festgelegt sind, wird der Anzeigestil gemäß den CSS-Einstellungen angezeigt.


HTML-Link-Syntax

Der HTML-Code des Links ist sehr einfach. Es sieht so aus: :

Das href-Attribut beschreibt das Ziel des Links. .

Beispiel

Die obige Codezeile wird wie folgt angezeigt: Besuchen Sie das Rookie-Tutorial

Durch Klicken auf diesen Hyperlink gelangt der Benutzer zur Startseite des Rookie-Tutorials.

Tipp: „Linktext“ muss kein Text sein. Bilder oder andere HTML-Elemente können zu Links werden.


HTML-Links – Zielattribut

Mit dem Zielattribut können Sie festlegen, wo das verlinkte Dokument angezeigt wird.

Die folgende Zeile öffnet das Dokument in einem neuen Fenster:

Beispiel

<a href="" target="_blank">Besuch Noob-Tutorial!a>

Probieren Sie es aus»


HTML-Links – id-Attribut

Das id-Attribut kann zum Erstellen von Lesezeichen-Tags in einem HTML-Dokument verwendet werden.

Tipp: Lesezeichen werden nicht auf besondere Weise angezeigt und werden nicht in HTML-Dokumenten angezeigt, sodass sie für Leser verborgen sind.

Beispiel

ID in HTML-Dokument einfügen:

Erstellen Sie im HTML-Dokument einen Link zum Abschnitt „Hilfreiche Tipps“ (id="tips"):

Alternativ können Sie von einer anderen Seite aus einen Link zum Abschnitt „Hilfreiche Tipps (id="tips")" erstellen:


Grundlegende Hinweise – Hilfreiche Tipps

Hinweis: Fügen Sie Unterordnern immer Schrägstriche hinzu. Wenn Sie den Link so schreiben: href="http://www.runoob.com/html", werden zwei HTTP-Anfragen an den Server generiert. Dies liegt daran, dass der Server der Adresse einen Schrägstrich hinzufügt und dann eine neue Anfrage erstellt, etwa so: href="http://www.runoob.com/html/".



Weitere Beispiele

Bildlink
So verwenden Sie den Bildlink.

Link zur angegebenen Stelle auf der aktuellen Seite
So verwenden Sie Lesezeichen

Aus dem Rahmen springen
Dieses Beispiel zeigt, wie Sie ausgehend von Ihrer Seite aus dem Rahmen springen ist im Rahmen fixiert.

E-Mail-Link erstellen
Dieses Beispiel zeigt, wie Sie einen Link zu einer E-Mail erstellen. (Dieses Beispiel funktioniert nur nach der Installation eines E-Mail-Client-Programms.)

E-Mail-Link 2 erstellen
Dieses Beispiel zeigt einen komplexeren E-Mail-Link.


HTML-Link-Tag


标签 描述
定义一个超级链接

Das obige ist der detaillierte Inhalt vonBeispiel-Tutorial zu HTML-Links. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage