Il était une fois un hover qui fonctionnait pas...

Bonjour!

Je dois avoir une série d'images et pour chacune d'entre elles, je dois avoir une image en hover lorsque le curseur défile dessus.

Voici ce que j'ai fait

<style>
.img01{
	width: 313px; 
	height: 336px; 
	background: url("images/images-bf/9385241.jpg") no-repeat; 
}
.img01:hover{
	width: 313px; 
	height: 336px; 
	background: url("images/images-bf/9385241-1.jpg") no-repeat; 
}
</style> 

    <div class="col-sm-12 col-md-4">
        <div class="#img01">
			<a href="">

			</a>
        </div>
    </div>

Pouvez-vous m'aider? Les images n'apparaissent pas.. et je me demande comment le <a href> peut fonctionner si l'image principale n'est pas dans la div.
(NB : Le site est en aspx.. Je ne sais pas si ça peut poser un problème...)

Merci!
Modifié par Maggie83 (18 Nov 2015 - 18:47)

Bonsoir,

Si ton élément est construit ainsi :

<div class="#img01"> 

alors il faut le cibler ainsi :

.#img01 {   } 

(ce qui est un peu curieux, à quoi te sert ton # dans le nom de ta classe ?)
Modifié par Raphael (18 Nov 2015 - 19:05)

Bonsoir Maggie,

Ta classe porte le doux nom de img01 dans ta feuille de styles, ton code HTML fait appel à la classe #img01....

Ceci étant dit, je serai très étonné que ce soit la bonne façon de procéder (mais je peux me tromper ), tout dépend de ce que représentent ces images, mais de loin, ça ressemble à une galerie photo, et si d'aventure ces images ne sont pas disponibles ou que ton visiteur ne désire pas les afficher... Il n'y a plus aucune information sur le vide qui pourrait apparaître dans ta page sur cette portion de code...
(Mots clés, accessibilité, texte alternatif,...)

Mais je peux me tromper

*le chef est trop rapide pour moi
Modifié par 6l20 (18 Nov 2015 - 19:14)

Ahah! Que je suis gênée!
C'est tout vrai, le coupable est mon nom de class.

Merci beaucoup pour vos réponses rapides!

Bonjour,

6l20 a écrit :
*le chef est trop rapide pour moi

Ce n'est pas grave, il nous a créer un nouveau sélecteur "classid" (bref, une coquille dans le code)