[css3.svg]CSS3 - pseudo classes - dynamic

:visited

A link that been visited.


  a:visited {
      background-color: red;
  }
  

  <a href="visited.html">Click to visit</a>
  

:hover

The mouse is over the element.


  .button:hover, .a:hover {
      outline: 1pt solid blue;
  }
  
Hover me Link

  <button>Hover me Button</button>
  <a href="#">Hover me Link</a>
  

:active

The element is being clicked.


  .button:active, .a:active {
      background-color: green;
  }
  
Click and Hold

  <button>Click and Hold</button>
  <a href="#">Click and Hold</a>
  

:focus

The element has the keyboard focus.


  .button:focus, .a:focus {
      background-color: violet;
  }
  
Focus me Link

  <button>Focus me Button</button>
  <a href="#">Focus me Link</a>
  

Ads by Google

Ask a question, send a comment, or report a problem - click here to contact me.

© Richard McGrath