Comment mettre une dimension fixe sur une image

Fermé

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - 28 juin 2013 à 12:17
flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 - 28 juin 2013 à 12:55

bonjour a tous
j ai récupéré un morceau de code ,que je souhaiterais juste modifie très légèrement

Lors du survol de la souris sur le lien une image apparait je souhaiterais que cette image sois de dimension de 100*100 par exemple , mais que cela soit effectuer dans le css du code

car j aurais beaucoup d image a traiter

<head>
   <style type="text/css">
      .vignette span
      {
         display: none; /* On masque le span par défaut */
      }
      a.vignette:hover
      {
         border: 0; /* Pour que ce soit fonctionnel sous IE */
      }
      a.vignette:hover span /* On définit où va s'afficher l'image au passage de la souris */
      {
         display: block;
         position: absolute;
         top: 150px;
         left: 150px;
      }
   </style>
</head>
<body>
   <p>
      <a href="http://www.lenco.eu/fr/p/xemio-858-6/" class="vignette" title="Image 3"><img src="image1.jpg" alt="ecran1.jpg" /><span><img src="ecran1.jpg" alt="Image 2" /></span></a>&nbsp;
     
   </p>
</body>
</html>

merci de reponses

A voir également:

Comment mettre une dimension fixe sur une image
Comment agrandir une image - Guide
Comment rechercher une image sur google - Guide
Créer une image iso - Guide
Comment inserer une image sur word - Guide
Légender une image - Guide

3 réponses

Réponse 1 / 3

inspiring Messages postés 1813 Date d'inscription vendredi 28 janvier 2011 Statut Membre Dernière intervention 31 décembre 2018 265
28 juin 2013 à 12:29

bonjour

en ajoutant :

a.vignette:hover span /* On définit où va s'afficher l'image au passage de la souris */
{
display: block;
position: absolute;
top: 150px;
left: 150px;
width:100px;
height:100px;
}

Réponse 2 / 3

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
28 juin 2013 à 12:32

Bonjour
merci pour la reponse
j ai essayer mais cela ne fonctionne pas , j ai toujours une grande image

Réponse 3 / 3

flexi2202 Messages postés 3801 Date d'inscription lundi 14 mars 2011 Statut Membre Dernière intervention 21 octobre 2024 187
28 juin 2013 à 12:55

de cette facon cela fonctionne mais je desire que cette dimension sois dans un css height="100" width="100"

<head>
   <style type="text/css">
      .vignette span
      {

         display: none; /* On masque le span par défaut */
      }
      a.vignette:hover
      {
         border: 0; /* Pour que ce soit fonctionnel sous IE */
	
      }
     a.vignette:hover span /* On définit où va s'afficher l'image au passage de la souris */
{
display: block;
position: absolute;
top: 15px;
left: 150px;

} 
   </style>
</head>
<body>
   <p>
      <a href="http://www.lenco.eu/fr/p/xemio-858-6/" class="vignette" title="Image 3"><img src="image1.jpg" alt="ecran1.jpg" /><span><img src="ecran1.jpg"height="100" width="100" alt="Image 2" /></span></a>
     
   </p>
</body>
</html>

Discussions similaires

Dimensions L x l x H : comment lire ces infos ?

Dechiffrer une image caché

Retrouver moi l'original

image ?