Vous pouvez interagir encore plus finement en CSS. Nous allons voir ici que nous pouvons changer l'apparence des éléments lorsque l'on clique dessus et lorsqu'ils sont sélectionnés !
:active : au moment du clic
Le pseudo-format
:active permet d'appliquer un style particulier au moment du clic. En pratique, il n'est utilisé que sur les liens.
Le lien gardera cette apparence très peu de temps : en fait, le changement intervient lorsque le bouton de la souris est enfoncé. En clair, ce n'est pas forcément toujours bien visible.
On peut par exemple changer la couleur de fond du lien lorsque l'on clique dessus :
1
2
3
4
| a:active /* Quand le visiteur clique sur le lien */{ background-color: #FFCC66;} |
:focus : lorsque l'élément est sélectionné
Là, c'est un peu différent. Le pseudo-format
:focus applique un style lorsque l'élément est sélectionné.
C'est-à-dire ?
Une fois que vous avez cliqué, le lien reste « sélectionné » (il y a une petite bordure en pointillés autour). C'est cela, la sélection.
Essayons pour l'instant sur les liens :
1
2
3
4
| a:focus /* Quand le visiteur sélectionne le lien */{ background-color: #FFCC66;} |
0 commentaires:
Enregistrer un commentaire