Tutoriel HTML / XHTML

HTML

Découvez les bases de HTML et XHTML dans ce tutoriel.

HTML5 CSS Dreamweaver Bootstrap PHP

Liens hypertexte en HTML

Qu-est ce qu'un lien hypertexte ?

Un hyperlien, ou lien hypertexte, ou lien web, ou simplement lien, est une référence dans un système hypertexte permettant de passer automatiquement d'un document consulté à un document lié. Les hyperliens sont notamment utilisés dans le World Wide Web pour permettre le passage d'une page Web à une autre à l'aide d'un clic.

Liens vers une page qui se trouve dans votre répertoire

Exemple de lien pointant à la racine de votre répertoire

<a href="index.php" title="Qu'est ce que le HTML">Qu'est ce que le HTML ?</a>

Exemple d'arborescence

dossier_racine

index.html

contact.html (Pour revenir à la page index.html <a href="index.html" title="Accueil">Accueil</a>)

css

images

medias

telechargements

pdf

listing-des-pdf.html (Pour revenir à la page index.html <a href="../../index.html" title="Accueil">Accueil</a>)

telechargements.html (Pour revenir à la page index.html <a href="../index.html" title="Accueil">Accueil</a>)

../ : je remonte d'un rang dans l'arborescence.

../../ : je remonte de 2 rangs dans l'arborescence.

../../../ : je remonte de 3 rangs dans l'arborescence etc ...

Les principaux attributs des liens hypertextes

href: Le chemin vers la page à lier.
title Affiche une info bulle sur le lien
target

_blank : Ouverture de la page cible dans une nouvelle fenêtre

_parent : Ouverture de la page cible dans le cadre parent (de niveau immédiatement supérieur)

_self : (Valeur par défaut) Ouverture de la page cible dans le cadre d'appel

_top : Ouverture de la page cible dans la fenêtre hôte (par-dessus le FRAMESET)

Liens vers une url

Exemple

<a href="http://www.conseil-webmaster.com/" title="Conseil webmaster">Conseil webmaster</a>

Un lien qui s'ouvre dans une nouvelle fenêtre

Exemple

<a href="http://www.conseil-webmaster.com/" title="Conseil webmaster" target="_blank">Conseil webmaster</a>

Liens vers messagerie

Exemple

<a href="mailto:contact@lc-formateur.com">Contactez moi par email en cliquant qur ce lien</a>

Ajouter le sujet de l'email

<a href="mailto:contact@lc-formateur.com?subject=informations">M'envoyer en email en ajoutant le sujet</a>

Ancres

Une ancre permet d'envoyer à un niveau précis dans une page HTML

Les exemples que vous allez souvent retouver "Haut de page", "Bas de page"

Exemple

<a href="liens-hypertexte-html.php#ancre1" title="Revenir au début de cette page">Cliquez ici pour revenir en haut de la page</a>