The CSS reference

":active" - css pseudo-class (v. css 1)

  • Will add a style to an element that is activated.
  • For example, between the times the user presses the mouse button and releases it.
  • HTML usage: all elements
  • Note: that the :hover must be placed after the :link and :visited rules, since otherwise the cascading rules will hide the 'color' property of the :hover rule.
  • Similarly, because :active is placed after :hover, the active color will apply when the user both activates and hovers over the element.
  • Browsers that support the :active - pseudo-class :
    Internet Explorer Mozilla Firefox Opera Google Chrome Apple Safari
Typical usage:
a:active  { color: lime }   /* active links    */

Pseudo-class ":active" example:

    <title>Page title</title>
    <style type="text/css">
      input[type='submit']:hover {
        background-color: #FF8000;
        color: #0080FF; }
     input[type='submit']:active {
        background-color: #0000FF;
        color: #FFFF00; }
      a:link {   background-color: #000000;
        color: #FFFFFF; }
      a:visited { background-color: #97FF31;
        color: #9831FF;  }
      a:hover { background-color: #7171E8;
        color: #E8E871; }
      a:active { background-color: #0000FF;
        color: #FFFF00; }
    <form action="" target="_blank">
      Go to : <input type="submit" value="Yahoo" />
    <a href="" target="_blank">
      Go to!</a>
© 2010 by Finnesand Data. All rights reserved.
This site aims to provide FREE programming training and technics.
Finnesand Data as site owner gives no warranty for the correctness in the pages or source codes.
The risk of using this web-site pages or any program codes from this website is entirely at the individual user.