Le principe de base d'une transition CSS3 est de permettre une transition douce entre l'ancienne valeur et la nouvelle valeur d'une propriété CSS lorsqu'un événement est déclenché :
Pour définir une nouvelle transition animée, il est nécessaire de préciser au minimum :
Etape 01 : insérer les deux images les unes à la suite des autres dans le code HTML, les identifier
Etape 02:les superposer en les positionnant en absolu
Etape 03:spécifier que l'image du premier plan a une opacité 1, déterminer une durée et un effet de transition
Etape 04: spécifier qu'au survol, elle aura une opacité de 0 (et ainsi faire apparaître l'image en arrière-plan).