Hello
C'est un petit tutoriel réalisé par mes soins, donc demandez moi pour redistribuer.
Qu'est-ce qu'un hover ?
Le hover est une chose purement magique qui sert à faire des choses très belles en codage. Par exemple vous prenez une image vous la survolez et que quelque chose d'autre apparaît à sa place, c'est tout de suite magique ! Pour se faire, vous n'aurez qu'à être administrateur ou bien créer une page HTML. Un petit exemple de hover par exemple : [Vous devez être inscrit et connecté pour voir ce lien] !
On commence quand ?
Maintenant ! Donc on va apprendre à faire la petite chose dans la hover ! Rendez vous dans Panneau d'admin - Affichage - Couleurs - Feuille de style CSS ! On va commencer par la base. On va créer un une nouvelle balise. Appelons-la "hey" pour faire court et simple !

Code:

 .hey { opacity: 0.0; }

Oulà attends là ! C'est quoi cette opacity ? Tout bêtement l'opacité : opacity 0, on voit l'image lorsque la souris n'est pas dessus. Opacity 1, on ne voit plus l'image mais la partie blanche où le texte est ! On complique ?

Code:

 .hey { opacity: 0.0;  transition-duration: 0.6s;  -moz-transition-duration: 0.6s;  -webkit-transition-duration: 0.6s;  -o-transition-duration: 0.6s;}

Transition-duration etc. → ce sont les secondes pendant la transition, libre à vous d'y mettre les valeurs que vous désirez !
Bien accrochés ? Passons au hover ! Enfin, le voilà !

Code:

.hey:hover {opacity: 0.9;}

Et voilà ! Il n'y a rien de plus simple ! Pourquoi avoir mis 9 en valeur ? Pour que l'on voit encore un peu l'image derrière (a).
Et voilà ! Pas si dûr que ça finalement ! Maintenant, passons au HTML...

Code:

<center><div style="background: url('IMG 245*245');  width: 245px; height: 245px;"><div class="hey";><div style="background: #fff; height: 245px; "><div style="padding: 10px; font: 10px cambria; text-align: justify; height: 220px; overflow: auto; line-height: 12px; ">Bon bah vous êtes trop forts !</div></div></div></div>

Je vous le donne direct mais je vais vous expliquer... Libre à vous de modifier toutes les mesures, ce sont les "px" à changer, rien de bien méchant ! La couleur de fond est changeable aussi, vous n'aurez qu'à modifier la balise "background : #fff" et le reste est modifiable, c'était juste un exemple pour vous servir, vous pouvez tout changer ! La personnalisation était le but du tutoriel ! (rapel ! width : largeur ; height : hauteur)
Question pratique.
On met à la suite les deux codes CSS ? (hey et hey:hover)
→ Oui, il faut les mettre à la suite ! Ne vous posez pas de questions, le CSS c'est fait pour être tous mis à la suite, vous pouvez tout mettre dans le désordre mais de préférence le hey avant le hey:hover sinon ça va vous faire des trucs bizarres !
Pour ce qui est du codage et du CSS, ne vous dîtes pas d'entrée de jeu que c'est sûr, il faut être un minimum patient et puis ce n'est que de l'anglais !
Si vous avez des questions, n'hésitez pas à poster !
LOVERDOSE.