HTML - image à la place d'une case à cocher
Résolu
spylller
Messages postés
441
Statut
Membre
-
spylller Messages postés 441 Statut Membre -
spylller Messages postés 441 Statut Membre -
Bonjour,
Je souhaiterais mettre le choix des langues sous forme de drapeau, qu'on puisse cliquer sur un seul, et que cela marche comme des zones d'options. Mais je trouve pas comment faire.
Merci de votre aide ;)
Je souhaiterais mettre le choix des langues sous forme de drapeau, qu'on puisse cliquer sur un seul, et que cela marche comme des zones d'options. Mais je trouve pas comment faire.
Merci de votre aide ;)
A voir également:
- HTML - image à la place d'une case à cocher
- Raccourci clavier case à cocher ✓ - Forum Excel
- Case à cocher word - Forum Word
- In da place - Forum Mail
- Cocher une case avec le clavier - Forum Clavier
- Frédéric cherche à faire le buzz sur les réseaux sociaux. il a ajouté une image d’ours polaire sur une image de plage. retrouvez l'image originale de la plage. que cache l'ours polaire ? - Forum Graphisme
1 réponse
J'ai trouvé un petit tuto anglais qui m'a aidé.
<div class="case">
<input class="casex" type="radio" name="pays" value="fr" id="fr"/>
<label for="fr" style="background-image: url('images/fr.png');"></label>
</div>
<br/>
<div class="case">
<input class="casex" type="radio" name="pays" value="ang" id="ang"/>
<label for="ang" style="background-image: url('images/ang.png');"></label>
</div>
<br/>
.case
{
width: 164px;
height: 84px;
background-color: #2e2e2e;
position: relative;
margin:0;
}
.case input[type="radio"]
{
visibility: hidden;
}
.case label
{
width: 160px;
height: 80px;
position: absolute;
left: 2px;
top:2px;
background-size: 100%;
}
.case label:before
{
content:'';
width: 160px;
height: 80px;
background-color: gray;
position: absolute;
opacity: 0.4;
}
.case input[type="radio"]:checked + label:before
{
opacity: 0;
}