Changer la couleur d'un bouton au clic

Thom Leroy
Les bases HTML/CSS

Bonjour à tous. J'ai un petit soucis tout bête, mais je n'arrive pas à le résoudre.
Je souhaiterais qu'au clic de ma souris, une partie de mon bouton change de couleur.
(Bon, dis comme ça c'est super brouillon, alors je met une image de mon boutton, vous allez vite comprendre ^^)

http://hpics.li/3a3d39a

Si vous voulez, mon bouton est bleu, mais au moment où je clic dessus, j'ai cette couleur, et c'est cette couleur que je voudrais changer !

Y a-t-il une méthode pour le faire ?
Merci d'avance !

5 réponses

charlestati
Réponse acceptée

Si j'ai bien compris, tu as besoin de la pseudo-classe CSS :active

https://developer.mozilla.org/fr/docs/Web/CSS/:active

Brandon Sauveniere

Coucou, parles-tu de quelque chose comme ceci : http://codepen.io/Brandys/pen/WodreB

N'hésite pas à te renseigner également via le lien de @charlestati

betaWeb

Salut,

Je pense que c'est tout simplement du au :focus, inspectes ton élément, force le focus et regarde quelles sont les règles/classe appliquées ;)

Balsakup

Comme l'a dit @betaWeb, c'est au niveau du focus qu'il faut changer les règles si tu veux que la couleur reste après avoir effectué le clique

button {
    background-color: blue;
}

button:active {
    background-color: red;
    outline: none; /* Pour enlever la bordure bleu */
}
Thom Leroy
Auteur

Bonjour à tous, merci pour vos réponses.
C'était effectivement ça, je me doutais qu'une "classe" comme le :hover existait mais je ne la trouvait pas, merci ! :)