Exemple de code HTML: Explication détaillée des hyperliens

Auteur：Eve Cole Date de mise à jour：2025-06-11 12:32:01

Les hyperliens sont des éléments HTML qui sont fréquemment utilisés dans les sites Web, car diverses pages du site Web sont composées d'hyperliens, et les hyperliens terminent le saut entre les pages. Les hyperliens sont le principal moyen d'interaction entre les téléspectateurs et les serveurs, et l'apprentissage sera progressivement approfondi dans les technologies suivantes. Lien hypertexte

- Remarque: les images peuvent également être utilisées comme liens, et vous apprendrez en détail les images de la page Web du chapitre suivant.

4.5.1 Ajouter des liens au texte

La balise d'un hyperlien est <a> </a>, ajoutant un hyperlien au texte est similaire à d'autres balises modifiées. Le texte après le lien a son propre style spécial pour le distinguer des autres textes. Le style de liaison par défaut est le texte bleu et souligné. L'hyperlien est redirigé vers une autre page, et la balise <a> </a> a un attribut HREF qui est responsable de la spécification de l'adresse de la nouvelle page. L'adresse spécifiée par HREF utilise généralement l'adresse relative.

- Remarque: Dans le développement du site Web, les documents sont plus couramment utilisés par rapport aux adresses.

Créez un fichier de page Web dans le répertoire D: / Web / nommé A.HTM, et écrivez le code comme indiqué dans le code 4.18.

Code 4.18 Paramètres d'hyperlien: A.HTM

<html>

<adal>

<Title> Paramètres des hyperliens </Title>

</ head>

<body>

<a href = ul_ol.htm> Entrez la page Paramètres de la liste </a>

</docy>

</html>

Entrez http: //localhost/a.htm dans la barre d'adresse du navigateur, et l'effet de navigation est illustré à la figure 4.19.

Figure 4.19 Paramètres d'hyperlien

Les lecteurs peuvent voir le style par défaut de l'hyperlien de la figure 4.19. Lorsque vous cliquez sur le lien dans la page, la page accédera à la page UL_OL.htm dans le même répertoire, c'est-à-dire la page des paramètres de la liste dans la section précédente. Lorsque vous cliquez sur le bouton de retour du navigateur et revenez à la page A.HTM, la couleur du lien texte devient violet, qui indique à la visionneuse que ce lien a été visité.

4.5.2 Modifier la méthode d'ouverture de la fenêtre du lien

Par défaut, la façon dont les hyperliens ouvrent de nouvelles pages sont l'abandon de soi. Selon les différents besoins du spectateur, les lecteurs peuvent spécifier d'autres façons d'ouvrir de nouvelles fenêtres pour l'hyperlien. La balise hyperlienne fournit l'attribut cible pour le paramètre, avec des valeurs telles que _fre (auto-écraser, par défaut), _blank (créer une nouvelle fenêtre pour ouvrir une nouvelle page), _top (ouvrir dans la fenêtre du navigateur entier, toutes les structures de trame seront ignorées) et _parent (ouvrir dans la fenêtre précédente).

- Remarque: les méthodes _top et _parent sont utilisées pour les pages de trame, et il existe des explications détaillées dans les chapitres suivants.

4.5.3 Ajouter du texte de l'invite au lien

Dans de nombreux cas, le texte de l'hyperlien ne suffit pas pour décrire le contenu à lier. La balise hyperlienne fournit des attributs de titre pour faciliter les invites pour les téléspectateurs. La valeur de l'attribut de titre est le contenu rapide. Le contenu rapide apparaîtra lorsque le curseur du navigateur restera sur l'hyperlien, ce qui n'affectera pas la netteté de la disposition de la page. Modifiez le fichier de page Web A.HTM et écrivez le code comme indiqué dans le code 4.19.

Code 4.19 Paramètres d'hyperlien: A.HTM

<html>

<adal>

<Title> Paramètres des hyperliens </Title>

</ head>

<body>

<a href = ul_ol.htm cible = _blank title = bonjour lecteur, ce que vous voyez maintenant est le texte de l'invite. Cliquez sur ce lien pour sauter sur la page ul_ol.htm. > Entrez la page Paramètres de la liste </a>

</docy>

</html>

Entrez http: //localhost/a.htm dans la barre d'adresse du navigateur, et l'effet de navigation est illustré à la figure 4.20.

Figure 4.20 Texte d'invite hyperlienne

4.5.4 Qu'est-ce qu'une ancre

De nombreux articles Web ont beaucoup de contenu, ce qui mène à une longue page. Les téléspectateurs doivent faire glisser constamment la barre de défilement du navigateur pour trouver le contenu dont ils ont besoin. La fonction d'ancrage de l'hyperlien peut résoudre ce problème. L'ancre est une ancre qui est tirée du navire. Une fois l'ancre jeté vers le bas, le navire ne flottera pas facilement ou ne se perdra pas. En fait, les ancres sont utilisées pour sauter à différents endroits dans une seule page, et dans certains endroits, ils s'appellent des signets.

L'attribut de nom de la balise hyperlienne est utilisé pour définir le nom de l'ancre. Une page peut définir plusieurs ancres. Grâce à l'attribut HREF de l'hyperlien, vous pouvez sauter à l'ancre correspondante en fonction du nom. Créez un fichier de page Web dans le répertoire d: / web /, nommé a_anchor.htm, et écrivez le code comme indiqué dans le code 4.20.

Code 4.20 Anchor d'hyperlien: a_anchor.htm

<html>

<adal>

<Title> Paramètres des hyperliens </Title>

</ head>

<body>

<a name = top> voici l'ancre en haut </a>

<a href = # 4> la 4ème personne </a>

<h2> Les présidents réussis des États-Unis </h2>

● La première personne (1789-1797) <A name = 1> Ceci est l'ancre de la première personne </a>

Nom: George Washington

George Washington <r />

Né et décédé: 1732-1799

Parti politique :: Fédération

● La deuxième personne (1797-1801) <A name = 2> Voici l'ancre de la deuxième personne </a>

Nom: John Adams

John Adams

Né et décédé: 1735-1826

Parti politique :: Fédération

● La troisième personne (1801-1809) <A name = 3> Voici l'ancre de la troisième personne </a>

Nom: Thomas Jefferson

Thomas Jefferson

Né et décédé: 1743-1826

Parti politique :: Parti communiste populaire

● Le 4ème post (1809-1817) <A name = 4> Voici l'ancre du 4ème post </a>

Nom: James Madison

James Madison

Né et décédé: 1751-1836

Parti politique: la République populaire de Chine

● Le 5ème post (1817-1825) <a name = 5> Ceci est l'ancre du 5ème post </a>

Nom: James Monroe

James Monroe

Né et décédé: 1758-1831

Parti politique: la République populaire de Chine

</docy>

</html> l>

Avant le test, les lecteurs peuvent voir à partir du code 4.20 que la balise <a> </a> est utilisée pour définir l'ancre, et le nom de l'ancre est défini avec l'attribut de nom (le nom n'a aucune restriction et peut être personnalisé). Le lien pour rechercher des ancres utilise l'attribut HREF pour spécifier le nom correspondant, et un symbole # doit être ajouté avant le nom. Entrez http: //localhost/a_anchor.htm dans la barre d'adresse du navigateur, et l'effet de navigation est illustré à la figure 4.21.

Figure 4.21 Ancre d'hyperlien

Lorsque la visionneuse clique sur l'hyperlien, la page fait automatiquement défiler vers la position d'ancrage du nom de la valeur d'attribut HREF.

- Remarque: l'étiquette définissant l'ancre ne nécessite pas nécessairement un contenu spécifique, c'est juste un positionnement.

4.5.5 Liens de messagerie électronique, FTP et Telnet

Les hyperliens peuvent élargir davantage les fonctions des pages Web, et les plus couramment utilisées sont des connexions par e-mail, FTP et Telnet. Pour remplir les fonctions ci-dessus, il vous suffit de modifier la valeur HREF de l'hyperlien. Le format pour l'envoi d'un e-mail est:

<a href = mailto: adresse e-mail> Envoyez-moi un e-mail </a>

L'adresse e-mail doit être complète, comme [email protected].

Comme mentionné précédemment, le protocole HTTP est utilisé pour parcourir les pages Web, tandis que le serveur FTP est connecté par le protocole FTP. Le format de liaison est le suivant:

<a href = ftp: // Adresse IP de serveur ou nom de domaine> Texte lié </a>

La différence entre les liens du serveur FTP et les liens Web est que les protocoles utilisés sont différents. FTP nécessite l'autorisation de connexion de l'administrateur du serveur. Cependant, certains serveurs FTP sont accessibles de manière anonyme, obtenant ainsi des fichiers publics. De même, le serveur connecté au protocole Telnet adopte également une méthode similaire, le format est le suivant:

<a href = telnet: // Adresse IP de serveur ou nom de domaine> Texte lié </a>

Le protocole Telnet est très peu nombreux, et la plupart sont utilisés avec le protocole HTTP. Créez un fichier de page Web dans le répertoire d: / web /, nommé mail.htm, et écrivez le code comme indiqué dans le code 4.21.

Code 4.21 Autres paramètres pour les hyperliens: Mail.htm

<html>

<adal>

<Title> Autres paramètres pour les hyperliens </TITAL>

</ head>

<body>

<a href = Mailto: [email protected] Title = Hello Readers, Cliquez ici pour envoyer un e-mail. > Envoyez-moi un e-mail </a>

<a href = ftp: //101.22.25.11 title = Bonjour les lecteurs, bienvenue sur le serveur FTP. > Connectez le serveur FTP </a>

<a href = telnet: //101.22.25.11 title = Bonjour les lecteurs, bienvenue sur le serveur Telnet. > Connectez Telnet Server </a>

</docy>

</html> s

Entrez http: //localhost/mail.htm dans la barre d'adresse du navigateur, et l'effet de navigation est illustré à la figure 4.22.

Figure 4.22 Autres paramètres pour les hyperliens