HTML <a> Tag
Exemple
Créez un lien vers formation-ti.org :
<a href="https://www.formation-ti.org">Visitez formation-ti.org !</a> Plus d'exemples "Essayez-le vous-même" ci-dessous.
Définition et Utilisation
La balise <a> définit un hyperlien, utilisé pour lier une page à une autre.
L'attribut le plus important de l'élément <a> est l'attribut href , qui indique la destination du lien.
Par défaut, les liens apparaissent comme suit dans tous les navigateurs :
- Un lien non visité est souligné et bleu
- Un lien visité est souligné et violet
- Un lien actif est souligné et rouge
Conseils et Remarques
Conseil : Si la balise <a> n'a pas d'attribut href , elle sert uniquement de placeholder pour un hyperlien.
Conseil : Une page liée s'affiche normalement dans la fenêtre du navigateur actuelle, sauf si vous spécifiez une autre cible.
Conseil : Utilisez CSS pour styliser les liens : Liens CSS et Boutons CSS .
Support des Navigateurs
| Élément | |||||
|---|---|---|---|---|---|
| <a> | Oui | Oui | Oui | Oui | Oui |
Attributs
| Attribut | Valeur | Description |
|---|---|---|
| download | nom_de_fichier | Spécifie que la cible sera téléchargée lorsqu'un utilisateur cliquera sur l'hyperlien |
| href | URL | Spécifie l'URL de la page vers laquelle le lien mène |
| hreflang | code_langue | Spécifie la langue du document lié |
| media | media_query | Spécifie pour quel média/appareil le document lié est optimisé |
| ping | liste_d_URLs | Spécifie une liste d'URLs séparées par des espaces vers lesquelles, lorsque le lien est suivi, des requêtes post avec le corps ping seront envoyées par le navigateur (en arrière-plan). Utilisé typiquement pour le suivi. |
| referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin same-origin strict-origin-when-cross-origin unsafe-url | Spécifie quelles informations de référent envoyer avec le lien |
| rel | alternate author bookmark external help license next nofollow noreferrer noopener prev search tag | Spécifie la relation entre le document actuel et le document lié |
| target | _blank _parent _self _top | Spécifie où ouvrir le document lié |
| type | type_média | Spécifie le type de média du document lié |
Attributs Globaux
La balise <a> prend également en charge les Attributs Globaux en HTML .
Attributs d'Événement
La balise <a> prend également en charge les Attributs d'Événement en HTML .
Plus d'Exemples
Exemple
Comment utiliser une image comme lien :
<a href="https://www.formation-ti.org">
<img border="0" alt="formation-ti.org" src="logo_w3s.gif" width="100" height="100">
</a> Exemple
Comment ouvrir un lien dans une nouvelle fenêtre de navigateur :
<a href="https://www.formation-ti.org" target="_blank">Visitez formation-ti.org !</a> Exemple
Comment lier à une adresse e-mail :
<a href="mailto:someone@example.com">Envoyer un e-mail</a> Exemple
Comment lier à un numéro de téléphone :
<a href="tel:+4733378901">+47 333 78 901</a> Exemple
Comment lier à une autre section de la même page :
<a href="#section2">Aller à la Section 2</a> Exemple
Comment lier à un JavaScript :
<a href="javascript:alert('Hello World!');">Exécuter JavaScript</a> Pages Associées
Tutoriel HTML : Liens HTML
Référence DOM HTML : Objet Ancre
Tutoriel CSS : Styliser les Liens
Paramètres CSS par Défaut
La plupart des navigateurs afficheront l'élément <a> avec les valeurs par défaut suivantes :
a:link, a:visited {
color: ( valeur_interne );
text-decoration: underline;
cursor: auto;
}
a:link:active, a:visited:active {
color: ( valeur_interne );
}