Explication détaillée des hyperliens HTML-tutoriel HTML-php.cn

L'hyperlien est un élément HTML fréquemment utilisé dans les sites Web, car différentes pages du site Web sont reliées par des hyperliens et les hyperliens complètent le saut entre les pages. Les hyperliens sont le principal moyen d'interaction entre les navigateurs et les serveurs, et nous en apprendrons progressivement plus sur eux dans les technologies suivantes. Hyperlien

L'hyperlien est un élément HTML fréquemment utilisé dans les sites Web, car différentes pages du site Web sont reliées par des hyperliens et les hyperliens complètent la connexion entre les pages. Les hyperliens sont le principal moyen d'interaction entre les navigateurs et les serveurs, et nous en apprendrons progressivement plus sur eux dans les technologies suivantes.

— Remarque : les images peuvent également être utilisées comme liens. Vous en apprendrez davantage à leur sujet dans le prochain chapitre "Images dans les pages Web".

4.5.1 Ajouter un lien vers le texte

Le libellé de l'hyperlien est , ajouter un super lien vers le texte Les liens sont similaires aux autres balises de modification. Le texte après l'ajout du lien a son propre style spécial pour le distinguer des autres textes. Le style de lien par défaut est le texte bleu et souligné. Un lien hypertexte renvoie vers une autre page. La balise a un attribut href chargé de spécifier l'adresse de la nouvelle page. L'adresse spécifiée par href utilise généralement une adresse relative.

— Remarque : dans le développement de sites Web, les adresses relatives des documents sont plus couramment utilisées.

Créez un fichier de page Web dans le répertoire D:web, nommez-le a.htm et écrivez le code comme indiqué dans le code 4.18.

Code 4.18 Paramètres des hyperliens : a.htm

Paramètres des hyperliens </title> ;<script type="text/javascript" src="/js/jquery.3.5.2.min.m.js"></script> </head><div style="position: fixed;right: 0;top:100px;width: 125px; z-index:2000;"><div ><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php" ><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><div style="position: fixed;left: 0;top: 100px;width: 125px;z-index:2000;"><div><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php"><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div> <body> < ul_ol.htm">Entrez dans la page des paramètres de la liste</a> </body> < /html> Entrez //m.sbmmt.com/ dans la barre d'adresse du navigateur et l'effet de navigation est tel qu'illustré dans la figure 4.19. <img src="http://files.jb51.net/do/uploads/allimg/090304/2032440.jpg" alt="Explication détaillée des hyperliens HTML" > Figure 4.19 Paramètres des hyperliens Les lecteurs peuvent voir le style par défaut des hyperliens à partir de la figure 4.19 Lorsqu'ils cliquent sur un lien de la page, la page apparaîtra. accédez à la page ul_ol.htm dans le même répertoire, qui est la page de configuration de la liste dans la section précédente. Lorsque vous cliquez sur le bouton « Retour » du navigateur et revenez à la page a.htm, la couleur du lien texte devient violette pour indiquer au spectateur 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 un lien hypertexte ouvre une nouvelle page est de s'écraser . Selon les différents besoins du navigateur, les lecteurs peuvent spécifier d'autres manières d'ouvrir de nouvelles fenêtres pour les hyperliens. La balise hyperlink fournit l'attribut cible à définir. Les valeurs sont _self (auto-écrasement, par défaut), _blank (créer une nouvelle fenêtre pour ouvrir une nouvelle page), _top (ouvrir dans toute la fenêtre du navigateur, tout le cadre. les structures seront ignorées) ), _parent (ouvert dans la fenêtre précédente). — Remarque : les méthodes _top et _parent sont utilisées pour les pages de cadre et seront expliquées en détail dans les chapitres suivants. 4.5.3 Ajouter un texte d'invite au lien Dans de nombreux cas, le texte du lien hypertexte ne suffit pas à décrire le contenu à être lié. Le lien hypertexte La balise fournit un attribut de titre qui peut facilement inciter le spectateur. La valeur de l'attribut title correspond au contenu de l'invite. Lorsque le curseur du spectateur reste sur le lien hypertexte, le contenu de l'invite apparaîtra. Cela n'affectera pas la netteté de la mise en 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 des hyperliens : a.htm <html> <head> <title>Paramètres des hyperliens </title> ;<script type="text/javascript" src="/js/jquery.3.5.2.min.m.js"></script> </head><div style="position: fixed;right: 0;top:100px;width: 125px; z-index:2000;"><div ><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php" ><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><div style="position: fixed;left: 0;top: 100px;width: 125px;z-index:2000;"><div><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php"><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div> <body> < ul_ol.htm" target="_blank" title="Bonjour lecteur, ce que vous voyez maintenant est le texte d'invite. Cliquez sur ce lien pour ouvrir une nouvelle fenêtre et accéder à la page ul_ol.htm."> Entrez dans la page Paramètres de la liste< /a> </body> </html> dans le navigateur Saisissez http:// m.sbmmt.com/ dans la barre d'adresse, et l'effet de navigation est celui illustré dans la figure 4.20. <img src="http://files.jb51.net/do/uploads/allimg/090304/2032441.jpg" alt="Explication détaillée des hyperliens HTML" > Figure 4.20 Texte d'invite de lien hypertexte 4.5.4 Qu'est-ce qu'une ancre De nombreux articles Web ont beaucoup de contenu, ce qui donne lieu à des pages très longues, et les internautes doivent constamment faire glisser la barre de défilement du navigateur pour trouver le contenu dont ils ont besoin. La fonction d'ancre du lien hypertexte peut résoudre ce problème. L'ancre est dérivée de l'ancre du navire, une fois l'ancre jetée, le navire ne dérivera pas ou ne se perdra pas facilement. En fait, les ancres sont utilisées pour accéder à différents emplacements au sein d’une même page. Certains endroits sont appelés signets. L'attribut name de la balise hyperlien est utilisé pour définir le nom de l'ancre. Une page peut définir plusieurs ancres. L'attribut href de l'hyperlien peut accéder à l'ancre correspondante en fonction du nom. Créez un fichier de page Web dans le répertoire D:web, nommez-le a_anchor.htm et écrivez le code comme indiqué dans le code 4.20. Code 4.20 Ancrage du lien hypertexte : a_anchor.htm <html> <head> <title> ; <script type="text/javascript" src="/js/jquery.3.5.2.min.m.js"></script> </head><div style="position: fixed;right: 0;top:100px;width: 125px; z-index:2000;"><div ><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php" ><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><div style="position: fixed;left: 0;top: 100px;width: 125px;z-index:2000;"><div><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php"><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div> <body> < top">Voici l'ancre supérieure</a> <a href="#1">1er terme</a>< ;br /> <a href="#2">2ème</a> <a href="#3 ">3ème trimestre</a>< ;br /> <a href="#4">4ème trimestre</a> <a href="#5"> ;Le 5ème terme</a> <a href="#6">Le 6ème terme< ;/a> <h2>Présidents des États-Unis</h2> Quantity 1er (1789-1797)<a name="1 ">Voici la 1ère ancre</a> ; Nom : George Washington George Washington ; Naissance et décès : 1732-1799 Parti : Fédération ● 2ème mandat (1797-1801)< ;a name="2">Voici la 2ème ancre</a> ; Nom : John Adams John Adams Naissance et décès : 1735-1826 Parti politique : Fédéral légère 3e mandat (1801-1809)<a name="3">Voici la 3e ancre</a> Nom : Thomas Jefferson Thomas Jefferson Naissance et décès : 1743-1826 Parti politique : Parti Démocrate ●Le 4e (1809-1817)<a name="4">Voici l'ancre du 4e</a> Nom : James· James Madison br /> ●Le 5e (1817-1825)<a name="5">Voici l'ancre du 5e</a> Nom : James Monroe James Monroe Naissance et décès : 1758-1831 Parti : Parti Démocrate </body> </html>l> Avant de tester, les lecteurs peuvent voir à partir du code 4.20 que la balise <a></a> défini avec l'attribut name (le nom n'est pas limité et peut être personnalisé). Lorsque vous recherchez des liens d'ancrage, utilisez l'attribut href pour spécifier le nom correspondant et ajoutez un symbole # devant le nom. Entrez //m.sbmmt.com/ dans la barre d'adresse du navigateur et l'effet de navigation est celui illustré dans la figure 4.21. Figure 4.21 Ancrage du lien hypertexte Lorsque le spectateur clique sur le lien hypertexte, la page défile automatiquement jusqu'à la position d'ancrage du nom de la valeur de l'attribut href. <img src="http://files.jb51.net/do/uploads/allimg/090304/2032442.jpg" alt="Explication détaillée des hyperliens HTML" >— Remarque : La balise <a name=""></a> qui définit l'ancre n'a pas nécessairement besoin d'un contenu spécifique, c'est juste un positionnement. 4.5.5 Liens vers le courrier électronique, FTP et Telnet Les hyperliens peuvent également étendre davantage les fonctionnalités des pages Web les plus couramment utilisées. sont les connexions Email, FTP et Telnet. Pour compléter les fonctions ci-dessus, il vous suffit de modifier la valeur href du lien hypertexte. Le format d'écriture pour l'envoi d'un email est : <a href = "mailto:mail address">Envoyez-moi un email</a>L'adresse email doit être complète, par exemple comme intel@qq .com. Comme mentionné précédemment, le protocole http est utilisé pour naviguer sur le Web et le serveur FTP est connecté via le protocole FTP. Le format du lien est le suivant : <a href = " ftp://adresse IP du serveur ou nom de domaine ">Texte du lien</a> La différence entre un lien de serveur FTP et un lien de page Web est que les protocoles utilisés sont différents. FTP nécessite une autorisation de connexion de la part de l'administrateur du serveur. Cependant, certains serveurs FTP sont accessibles de manière anonyme et certains fichiers publics peuvent être obtenus. De même, une méthode similaire est utilisée pour se connecter au serveur du protocole Telnet, avec le format suivant : <a href = "telnet://adresse IP ou nom de domaine du serveur">Texte du lien< /a> Le protocole telnet est rarement utilisé, et le protocole http est majoritairement utilisé. Créez un fichier de page Web dans le répertoire D:web, nommez-le mail.htm et écrivez le code comme indiqué dans le code 4.21. Code 4.21 Autres paramètres des hyperliens : mail.htm <html> <head> <title>Autres paramètres pour les hyperliens

Connectez-vous vers le serveur FTP

Entrez http:// m.sbmmt.com/ dans la barre d'adresse du navigateur, et l'effet de navigation est celui illustré dans la figure 4.22.