onclick dans le CSS?

Question

Ceci fonctionne:

#btnLeft:hover{
    width:70px;
    height:74px;
}

Ce dont j'ai besoin est:

#btnLeft:onclick{
    width:70px;
    height:74px;
}

Mais, il ne fonctionne pas.
Est-il possible à tous d'avoir onclick dans le CSS ?

Answer 1

Le plus proche que vous obtiendrez est - :active:

#btnLeft:active {
    width: 70px;
    height: 74px;
}

Cependant, cela ne s'applique le style lorsque le bouton de la souris est maintenu enfoncé. Le seul moyen pour appliquer un style et garder appliquée onclick est d'utiliser un peu de JavaScript.

Answer 2

Vous pouvez utiliser la pseudo-classe :target pour imiter sur l'événement click, laissez-moi vous donner un exemple.

Voici le code HTML:

<a href="#something">Show</a>
<div id="something">Bingo!</div>

Et voici le CSS:

#something {
  display: none;
}

#something:target {
  display: block;
}

Voici à quoi ça ressemble: http://jsfiddle.net/TYhnb/

Une chose à noter, c'est seulement limité à un lien hypertexte, donc si vous avez besoin d'utiliser sur d'autres que lien hypertexte, tel qu'un bouton, vous pouvez pirater un petit peu, comme le style d'un lien hypertexte à ressembler à un bouton.

Answer 3

Si vous donnez de l'élément une tabindex , alors vous pouvez utiliser l' :focus pseudo classe pour simuler un clic.

HTML

<img id="btnLeft" tabindex="0" src="http://placehold.it/250x100" />

CSS

#btnLeft:focus{
    width:70px;
    height:74px;
}

http://jsfiddle.net/NaTj5/

Answer 4

Edit: Répondu avant l'OP a précisé ce qu'il voulait. Ce qui suit est pour un onclick similaires au javascript onclick, pas le :active pseudo classe.

Ceci ne peut être réalisé soit avec Javascript ou la Case Hack

La case hack essentiellement fait de cliquer sur une étiquette, qui "vérifie" une case à cocher vous permettant de style de l'étiquette que vous le souhaitez.

La démo

Answer 5

il n'y a pas tout onclick en css, vous pouvez obly ce faire, :active

ou

essayez de jquery par ce que vous pouvez changer le style, l' Click()

comme dans les commentaires si c'est une image que l'jquery/javascript, c'est bien de faire comme

$("#btnLeft").click(function(){

     $(this).css("color","red");

})