HTML : les liens et les images
Les liens
Les liens hypertextes sont définis grâce à la balise <a> :
<a href="http://www.monsite.com">Ceci est un lien</a>
L’attribut href est obligatoire, il sert à définir l’url de destination du lien.
Lorsque vous déplacez le curseur de la souris sur un lien, deux choses se produise en général :
- La flèche de la souris se transforme en une petite main
- La couleur de l’élément de liaison va changer
Par défaut, les liens apparaîtront comme cela 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
Vous pouvez modifier les paramètres par défaut, en utilisant des styles :
- a: link, un lien non visité
- a: visited, un lien que l’utilisateur a visité
- a: hover, un lien au passage de la souris
- a: active, un lien actif, comme quand on a cliqué sur accueil et que l’on se trouve sur la page d’accueil.
Exemple :
<style> a: link {color : # 000000 ; background-color : transparent ; text-decoration : none} a: visited {color : # 000000 ; background-color : transparent ; text-decoration : none} a: hover {color: # ff0000 ; background-color : transparent ; text-decoration : underline} a: active {color: # ff0000 ; background-color : transparent ; text-decoration : underline} </ style >
L’attribut target
L’attribut target spécifie dans quelle page le lien va ouvrir le document lié. Cet exemple ouvre le document lié dans une nouvelle fenêtre de navigateur ou dans un nouvel onglet :
<a href="https://www.develop4fun.fr/" target="_blank">Visitez mon site</a>
Valeur de Target Description _blank ouvre le document lié dans une nouvelle fenêtre ou onglet.
_self ouvre le document lié dans la page affichée (par défaut)
_parent ouvre le document lié dans le cadre parent
_top ouvre le document lié dans le corps entier de la fenêtre
framename ouvre le document lié dans une frame
Si votre page Web est encapsulée dans une frame, vous pouvez utiliser target = “_ top” afin de sortir du cadre.
Exemple :
<a href="http://www.develop4fun.com" target="_top">Formation webdesigner</a>