129
Mise en forme des listes et création de barres de navigation
top: 140px;
left: 145px;
}
.imagemap .paul a {
top: 165px;
left: 245px;
}
Vous.pouvez.ensuite.appliquer.l’effet.de.survol.au.lien.d’ancre..Pour.cela,.changez.la.couleur.de.bordure.de.l’ancre,.d’abord.transparente,.en.la.rendant.jaune,.pour.les.états.hover.
et.focus :
.imagemap a:hover,
.imagemap a:focus {
border-color: #d4d82d;
}
Pour.afficher.la.note.lorsque.l’utilisateur.survole.la.zone.réactive,.vous.devez.d’abord.positionner.le.contenu.de.la.balise.span.de.note.sous.la.zone.réactive..Pour.cela,.définissez.un.
positionnement.absolu.pour.cette.balise.et.donnez-lui.une.position.négative.en.bas.(bottom)..
Pour.soigner.les.notes,.définissez.une.largeur,.un.remplissage.et.une.couleur.d’arrière-plan,.
puis.centrez.le.texte :
.imagemap a .note {
position: absolute;
bottom: -3em;
width: 7em;
padding: 0.2em 0.5em;
background-color:#ffc;
text-align: center;
}
La.Figure 6.13.présente.le.résultat.dans.un.navigateur.
Figure 6.13
Les survols à la Flickr
commencent à prendre
forme.