Historique des conversations
Chargement...
Chapitre 4 : Les liens et les ancres
Chapitre 4 : Les liens et les ancres
Créer un lien hypertexte
On utilise la balise <a> pour créer un lien. L'attribut href spécifie la destination.
<a href="https://www.google.com">Aller sur Google</a>Vous pouvez aussi ouvrir le lien dans un nouvel onglet avec target="_blank" :
<a href="https://www.google.com" target="_blank">Ouvrir dans un nouvel onglet</a>Créer un lien vers un fichier local
<a href="documents/monfichier.pdf">Télécharger le PDF</a>Créer une ancre dans la page
Les ancres permettent de naviguer vers une section précise d'une même page :
<a href="#section2">Aller à la section 2</a>
...
<h2 id="section2">Section 2</h2>
<p>Contenu de la section 2</p>Autres attributs utiles
download: pour forcer le téléchargement d'un fichierrel="noopener noreferrer": recommandé avectarget="_blank"pour la sécurité
<a href="rapport.pdf" download>Télécharger le rapport</a>
Évaluation des acquis
Correction immédiate
Quiz du chapitre 4
Ateliers pratiques & Projets
Testez vos compétences avec nos exercices guidés et le tuteur IA.
Ateliers pratiques & Corrigés détaillés
Ateliers pratiques & Corrigés
#1 — Lien externe
Atelier #1Crée un lien vers Google qui s'ouvre dans le même onglet.
Correction instantanée et bienveillante
Diagnostic du tuteur IA Weegosoft :
Consulter la solution type du formateur
Solution de référence :
<a href="https://www.google.fr">Aller sur Google</a>
#2 — Nouvel onglet
Atelier #2Crée un lien vers un site qui s'ouvre obligatoirement dans un nouvel onglet.
Correction instantanée et bienveillante
Diagnostic du tuteur IA Weegosoft :
Consulter la solution type du formateur
Solution de référence :
<a href="https://www.wikipedia.org" target="_blank">Wikipedia</a>
#3 — Lien mail
Atelier #3Crée un lien qui ouvre le logiciel de messagerie pour envoyer un email à contact@test.com.
Correction instantanée et bienveillante
Diagnostic du tuteur IA Weegosoft :
Consulter la solution type du formateur
Solution de référence :
<a href="mailto:contact@test.com">Envoyer un email</a>
#4 — Ancre interne (Cible)
Atelier #4Crée un élément avec l'id 'section1' qui servira de cible.
Correction instantanée et bienveillante
Diagnostic du tuteur IA Weegosoft :
Consulter la solution type du formateur
Solution de référence :
<h2 id="section1">Chapitre 1</h2>
<p>Contenu du chapitre...</p>
#5 — Lien vers ancre
Atelier #5Crée un lien qui mène directement vers l'élément ayant l'id 'section1'.
Correction instantanée et bienveillante
Diagnostic du tuteur IA Weegosoft :
Consulter la solution type du formateur
Solution de référence :
<a href="#section1">Aller au Chapitre 1</a>