Style Fleche interactive grace à :hover + :active [HTML5-CSS3]
Résolu/Fermé
A voir également:
- Style Fleche interactive grace à :hover + :active [HTML5-CSS3]
- Style word - Guide
- Photo de profil stylé - Guide
- Style d'écriture a copier coller - Guide
- La flèche de ma souris ne bouge plus - Forum souris / Touchpad
- Voyant clavier fleche ✓ - Forum Clavier
3 réponses
Salut,
La propriété css background-image n'est pas liée à l'attribut src de ta balise img, tu ne peux donc pas modifier ton image comme ceci.
Pour faire simple, utilise plutôt des balise div à la place de tes balises img :
HTML :
Bon développement
La propriété css background-image n'est pas liée à l'attribut src de ta balise img, tu ne peux donc pas modifier ton image comme ceci.
Pour faire simple, utilise plutôt des balise div à la place de tes balises img :
HTML :
<div style="position:absolute; top:230px; left:860px; width:25px; height:37px; background-image: url('image/flecheOverviewLeft.png');" class="FOL"></div>
<div style="position:absolute; top:230px; left:1165px; width:25px; height:37px; background-image: url('image/flecheOverviewRight.png');" class="FOR"></div>
Bon développement
RE : je vien de tester ce code :
HTML:
<span style="position:absolute; top:230px; left:860px; width:25px; height:37px; background-image:url('image/flecheOverviewLeft.png');" class="FOL"></span>
<span style="position:absolute; top:230px; left:1165px; width:25px; height:37px; background-image:url('image/flecheOverviewRight.png');" class="FOR"></span>
Ce code ne fonctionne toujours pas...
Est a cause du fait que j'ai utiliser des span a la place des div ?
HTML:
<span style="position:absolute; top:230px; left:860px; width:25px; height:37px; background-image:url('image/flecheOverviewLeft.png');" class="FOL"></span>
<span style="position:absolute; top:230px; left:1165px; width:25px; height:37px; background-image:url('image/flecheOverviewRight.png');" class="FOR"></span>
Ce code ne fonctionne toujours pas...
Est a cause du fait que j'ai utiliser des span a la place des div ?
J'ai trouver la solution !
Mon erreur été de mélanger déclaration de style en HTML et CSS.
Pour utiliser les :hover :active il faut que le style de l'element de base soit configurer en CSS. Or je le configurais en HTML:
*********************************************************************
HTML:
<span class="FOL"></span>
<span class="FOR"></span>
**********************************************************************
CSS:
.FOR
{
position:absolute;
background-image:url('image/flecheOverviewRight.png');
top:230px;
left:1165px;
width:25px;
height:37px;
}
.FOL
{
position:absolute;
background-image:url('image/flecheOverviewLeft.png');
top:230px;
left:860px;
width:25px;
height:37px;
}
**************************************************************************
Merci pour votre aide !
Mon erreur été de mélanger déclaration de style en HTML et CSS.
Pour utiliser les :hover :active il faut que le style de l'element de base soit configurer en CSS. Or je le configurais en HTML:
*********************************************************************
HTML:
<span class="FOL"></span>
<span class="FOR"></span>
**********************************************************************
CSS:
.FOR
{
position:absolute;
background-image:url('image/flecheOverviewRight.png');
top:230px;
left:1165px;
width:25px;
height:37px;
}
.FOL
{
position:absolute;
background-image:url('image/flecheOverviewLeft.png');
top:230px;
left:860px;
width:25px;
height:37px;
}
**************************************************************************
Merci pour votre aide !
20 juin 2013 à 15:25
PS: je peut mettre des span à la place des div ?