Css de contact (3/3)

Nous allons rajouter une couleur différente pour chaque icône de la page contact au passage de la souris.

Nous allons utiliser dans ce cas :hover et nth-child(n).

.contact a:hover:nth-child(1) svg {
    stroke: #00acee;
}

.contact a:hover:nth-child(2) svg {
    stroke: #4078c0;
}

.contact a:hover:nth-child(3) svg {
    stroke: #0077b5;
}

.contact a:hover:nth-child(4) svg {
    stroke: #e1306c;
}

Puis nous pouvons voir que les icônes changent de couleur.