Beispiel für HTML -Code: Detaillierte Erläuterung von Hyperlinks

Autor：Eve Cole Aktualisierungszeit：2025-06-11 12:32:01

Hyperlinks sind HTML -Elemente, die häufig auf Websites verwendet werden, da verschiedene Seiten der Website aus Hyperlinks bestehen, und Hyperlinks vervollständigen den Sprung zwischen den Seiten. Hyperlinks sind das Hauptmittel für die Interaktion zwischen Zuschauern und Servern, und das Lernen wird in den nachfolgenden Technologien allmählich vertieft. Hyperlink

- Hinweis: Bilder können auch als Links verwendet werden, und Sie lernen die Bilder auf der Webseite des nächsten Kapitels ausführlich.

4.5.1 Fügen Sie Links zum Text hinzu

Das Tag eines Hyperlinks lautet <a> </a> Das Hinzufügen eines Hyperlinks zum Text ähnelt anderen modifizierten Tags. Der Text nach dem Link hat seinen eigenen besonderen Stil, um ihn von anderen Texten zu unterscheiden. Der Standard -Linkstil ist blauer Text und unterstrichen. Der Hyperlink wird auf eine andere Seite umgeleitet, und das <a> </a> Tag hat ein HREF -Attribut, das für die Angabe der Adresse der neuen Seite verantwortlich ist. Die von HREF angegebene Adresse verwendet im Allgemeinen die relative Adresse.

- Hinweis: In der Website -Entwicklung werden Dokumente im Verhältnis zu Adressen häufiger verwendet.

Erstellen Sie eine Webseitendatei im D:/ Web/ -Verzeichnis mit dem Namen A.HTM und schreiben Sie den Code wie in Code 4.18 gezeigt.

Code 4.18 Hyperlink -Einstellungen: a.htm

<html>

<kopf>

<title> Einstellungen von Hyperlinks </title>

</head>

<body>

<Schriftgröße = 5>

<a href = ul_ol.htm> Geben Sie die Einstellungsseite der Liste ein </a>

</body>

</html>

Geben Sie http: //localhost/a.htm in die Browseradressleiste ein, und der Browsing -Effekt ist in Abbildung 4.19 dargestellt.

Abbildung 4.19 Hyperlink -Einstellungen

Leser können den Standardstil des Hyperlinks in Abbildung 4.19 sehen. Wenn Sie auf den Link auf der Seite klicken, springt die Seite zur Seite ul_ol.htm im selben Verzeichnis, dh der Seite "Listeneinstellungen" im vorherigen Abschnitt. Wenn Sie auf die Back -Schaltfläche des Browsers klicken und zur A.HTM -Seite zurückkehren, wird die Farbe des Textlinks lila, der dem Betrachter mitteilt, dass dieser Link besucht wurde.

4.5.2 Ändern Sie die Fenster Öffnungsmethode des Link -Fensters

Standardmäßig ist die Art und Weise, wie Hyperlinks neue Seiten öffnen, Selbstverteidiger. Abhängig von den verschiedenen Anforderungen des Betrachters können die Leser andere Möglichkeiten für das Öffnen neuer Fenster für den Hyperlink angeben. Das Hyperlink -Tag bietet das Zielattribut für die Einstellung mit Werten wie _self (Selbstüberschreibung, Standard), _blank (erstellen Sie ein neues Fenster, um eine neue Seite zu öffnen), _top (im gesamten Browserfenster öffnen, alle Frame -Strukturen werden ignoriert) und _parent (im vorherigen Fenster öffnen).

- HINWEIS: Die _top- und _ -parenten Methoden werden für Frame -Seiten verwendet, und es gibt detaillierte Erklärungen in den folgenden Kapiteln.

4.5.3 Fügen Sie dem Link einen Eingabeaufforderungstext hinzu

In vielen Fällen reicht der Text des Hyperlinks nicht aus, um den zu verknüpften Inhalt zu beschreiben. Das Hyperlink -Tag bietet Titelattribute, um die Eingabeaufforderungen für die Zuschauer zu erleichtern. Der Wert des Titelattributs ist der Eingabeaufforderungsinhalt. Der schnelle Inhalt wird angezeigt, wenn der Cursor des Browsers im Hyperlink bleibt, was die Sauberkeit des Seitenlayouts nicht beeinträchtigt. Ändern Sie die A.htm -Web -Datei und schreiben Sie den Code wie in Code 4.19 gezeigt.

Code 4.19 Hyperlink -Einstellungen: a.htm

<html>

<kopf>

<title> Einstellungen von Hyperlinks </title>

</head>

<body>

<Schriftgröße = 5>

<a href = ul_ol.htm target = _blank title = Hallo Reader, was Sie jetzt sehen, ist der Eingabeaufforderungstext. Klicken Sie auf diesen Link, um zur Seite ul_ol.htm zu springen. > Geben Sie die Einstellungsseite der Liste ein </a>

</body>

</html>

Geben Sie http: //localhost/a.htm in die Browser -Adressleiste ein, und der Browsing -Effekt ist in Abbildung 4.20 dargestellt.

Abbildung 4.20 Hyperlink -Eingabeaufforderung Text

4.5.4 Was ist ein Anker?

Viele Webartikel haben viele Inhalte, was zu einer langen Seite führt. Die Zuschauer müssen die Bildlaufleiste des Browsers ständig ziehen, um den Inhalt zu finden, den sie benötigen. Die Ankerfunktion des Hyperlinks kann dieses Problem lösen. Der Anker ist ein Anker, der aus dem Schiff gezogen wird. Nachdem der Anker heruntergeworfen wurde, schwebt das Schiff nicht leicht weg oder verliert sich. Tatsächlich werden Anker verwendet, um an verschiedenen Orten innerhalb einer einzelnen Seite zu springen, und an einigen Stellen werden sie als Lesezeichen bezeichnet.

Das Namensattribut des Hyperlink -Tags wird verwendet, um den Namen des Ankers zu definieren. Eine Seite kann mehrere Anker definieren. Durch das HREF -Attribut des Hyperlinks können Sie nach dem Namen zum entsprechenden Anker springen. Erstellen Sie eine Webseitendatei im D:/ Web/ -Verzeichnis mit dem Namen A_anchor.htm und schreiben Sie den Code wie in Code 4.20 gezeigt.

Code 4.20 Hyperlink Anchor: a_anchor.htm

<html>

<kopf>

<title> Einstellungen von Hyperlinks </title>

</head>

<body>

<Schriftgröße = 5>

<a name = top> Hier ist der Anker oben </a>

<a href =#4> Die 4. Person </a>

<h2> erfolgreiche Präsidenten der Vereinigten Staaten </H2>

● Die erste Person (1789-1797) <a name = 1> Dies ist der Anker der ersten Person </a>

Name: George Washington

George Washington

Geboren und gestorben: 1732-1799

Politische Partei :: Federation

● Die zweite Person (1797-1801) <a name = 2> Hier ist der Anker der zweiten Person </a>

Name: John Adams

John Adams

Geboren und gestorben: 1735-1826

Politische Partei :: Federation

● Die dritte Person (1801-1809) <a name = 3> Hier ist der Anker der dritten Person </a>

Name: Thomas Jefferson

Thomas Jefferson

Geboren und gestorben: 1743-1826

Politische Partei :: Kommunistische Partei der Menschen

● Der 4. Beitrag (1809-1817) <a name = 4> Hier ist der Anker des 4. Beitrags </a>

Name: James Madison

James Madison

Geboren und gestorben: 1751-1836

Politische Partei: Die Volksrepublik China

● Der 5. Beitrag (1817-1825) <a name = 5> Dies ist der Anker des 5. Beitrags </a>

Name: James Monroe

James Monroe

Geboren und gestorben: 1758-1831

Politische Partei: Die Volksrepublik China

</body>

</html> l>

Vor dem Test können die Leser aus Code 4.20 sehen, dass das <a> </a> Tag zum Definieren des Ankers verwendet wird und der Name des Ankers mit dem Namensattribut definiert wird (der Name hat keine Einschränkungen und kann angepasst werden). Der Link zur Suche nach Anchors verwendet das HREF -Attribut, um den entsprechenden Namen anzugeben, und ein # Symbol sollte vor dem Namen hinzugefügt werden. Geben Sie http: //localhost/a_anchor.htm in der Browser -Adressleiste ein, und der Browsing -Effekt ist in Abbildung 4.21 dargestellt.

Abbildung 4.21 Hyperlinkanker

Wenn der Betrachter auf den Hyperlink klickt, scrollt die Seite automatisch zur Ankerposition des HREF -Attributwertnamens.

- HINWEIS: Die Beschriftung, die den Anker definiert, benötigt nicht unbedingt spezifischen Inhalte, sondern nur eine Positionierung.

4.5.5 E -Mail-, FTP- und Telnet -Links

Hyperlinks können die Funktionen von Webseiten weiter erweitern, und die häufiger verwendeten sind E -Mail-, FTP- und Telnet -Verbindungen. Um die oben genannten Funktionen auszufüllen, müssen Sie nur den HREF -Wert des Hyperlinks ändern. Das Format zum Senden einer E -Mail lautet:

<a href = mailto: E -Mail -Adresse> Senden Sie mir E -Mail </a>

Die E -Mail -Adresse muss abgeschlossen sein, z. B. [email protected].

Wie bereits erwähnt, wird das HTTP -Protokoll zum Durchsuchen von Webseiten verwendet, während der FTP -Server durch das FTP -Protokoll verbunden ist. Das Link -Format lautet wie folgt:

<a href = ftp: // server IP -Adresse oder Domänenname> verknüpfter Text </a>

Der Unterschied zwischen FTP -Server -Links und Web -Links besteht darin, dass die verwendeten Protokolle unterschiedlich sind. FTP erfordert eine Anmeldeberechtigung vom Serveradministrator. Auf einige FTP -Server können jedoch anonym zugegriffen werden, wodurch einige öffentliche Dateien erhalten werden. In ähnlicher Weise verwendet der mit dem Telnet -Protokoll verbundene Server auch eine ähnliche Methode. Das Format lautet wie folgt:

<a href = telnet: // server IP -Adresse oder Domänenname> verknüpfter Text </a>

Das Telnet -Protokoll ist nur sehr gering, und das meiste wird mit dem HTTP -Protokoll verwendet. Erstellen Sie eine Webseitendatei im Verzeichnis d:/ web/ namens mail.htm und schreiben Sie den Code wie in Code 4.21 gezeigt.

Code 4.21 Weitere Einstellungen für Hyperlinks: Mail.htm

<html>

<kopf>

<title> Andere Einstellungen für Hyperlinks </title>

</head>

<body>

<Schriftgröße = 5>

<a href = mailto: [email protected] title = Hallo Readers, klicken Sie hier, um eine E -Mail zu senden. > Senden Sie mir eine E -Mail </a>

<a href = ftp: //101.22.25.11 title = hello readers, willkommen im ftp server. > Verbinden Sie den FTP -Server </a>

<a href = telnet: //101.22.25.11 title = Hallo Leser, willkommen im Telnet -Server. > Telnet -Server verbinden </a>

</body>

</html> s

Geben Sie http: //localhost/mail.htm in die Browseradressleiste ein, und der Browsing -Effekt ist in Abbildung 4.22 dargestellt.

Abbildung 4.22 Weitere Einstellungen für Hyperlinks