What is the mouse down selector in CSS?

I have noticed that buttons and other elements have a default styling and behave in 3 steps: normal view, hover/focus view and mousedown/click view, in CSS I can change the styling of normal view and hover view like this:

button{
  background:#333;
  color:#FFF;
}

button:hover{
  background:#000;
  color:#EEE;
}

but how can I select the mousedown? I want something like this:

button:mousedown{
  //some styling
}

thanks

I think you mean the active state

 button:active{
  //some styling
 }

These are all the possible pseudo states a link can have in CSS:

a:link {color:#FF0000;}    /* unvisited link, same as regular 'a' */
a:hover {color:#FF00FF;}   /* mouse over link */
a:focus {color:#0000FF;}   /* link has focus */
a:active {color:#0000FF;}  /* selected link */
a:visited {color:#00FF00;} /* visited link */

See also: http://www.w3.org/TR/selectors/#the-user-action-pseudo-classes-hover-act

I figured out that this behaves like a mousedown event:

button:active:hover {}

Pro-tip Note: for some reason, CSS syntax needs the :active snippet after the :hover for the same element in order to be effective

http://www.w3schools.com/cssref/sel_active.asp

I recently found out that :active:focus does the same thing in css as :active:hover if you need to override a custom css library, they might use both.

Just for the reference while looking this for myself too. I have made a simple and nice looking buttons from 90s. On the click it looks like pressed just by changing the border colors in short.

CSS:

#button {
    border-bottom: 1px solid gray;
    border-right: 1px solid gray;
    border-top: 1px solid white;
    border-left: 1px solid white;
    padding: 5px 30px;
    background-color: gainsboro;
}

#button:active {
    border-top: 1px solid gray;
    border-left: 1px solid gray;
    border-bottom: 1px solid white;
    border-right: 1px solid white;
}

HTML:

<button id="button">Click Here!</button>

And here is the result:

Not clicked

Clicked