Comment mettre une dimension fixe sur une image
flexi2202
Messages postés
3822
Date d'inscription
Statut
Membre
Dernière intervention
-
flexi2202 Messages postés 3822 Date d'inscription Statut Membre Dernière intervention -
flexi2202 Messages postés 3822 Date d'inscription Statut Membre Dernière intervention -
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
merci de reponses
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>
</p>
</body>
</html>
merci de reponses
A voir également:
- Comment mettre une dimension fixe sur une image
- Légender une image - Guide
- Comment rechercher une image sur google - Guide
- Mettre une image en filigrane sur word - Guide
- Créer une image iso - Guide
- Comment agrandir une image - Guide
3 réponses
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;
}
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;
}
Bonjour
merci pour la reponse
j ai essayer mais cela ne fonctionne pas , j ai toujours une grande image
merci pour la reponse
j ai essayer mais cela ne fonctionne pas , j ai toujours une grande image
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>