Marcar enlace de lista seleccionado

[AitorLopez]

Hola. Tengo un ejemplo como este

Código HTML:

<style>
ul {
    list-style: none;
    margin: 0;
    padding: 0;
    }
 
img {
    border: none;
    }
    
#menu_lat_izqdo {
    width: 100%;
    }
    
#menu_lat_izqdo li a {
    text-decoration: none;
    margin:0;
    border:0;
    padding:0;
    }   
    
#menu_lat_izqdo li a:link, #menu_lat_izqdo li a:visited {
    display: block;
    background-image: url(../imagenes/lat_izqdo/menu_claro.gif);
    background-repeat: no-repeat;
    color: #8BADCF;
    }
    
#menu_lat_izqdo li a:hover {
    background:  url(../imagenes/lat_izqdo/menu_oscuro.gif);
    background-repeat: no-repeat;
    color: #627EB7;
    }
 
#menu_lat_izqdo li a:link, #menu_lat_izqdo li a:visited, #menu_lat_izqdo li a:hover {
    padding-top: 5px;
    padding-bottom: 5px;
}
</style>
 
<div id="lat_izqdo">
    
 <div id="menu_lat_izqdo">
  <ul>
   <li>
     <h3><a href="prueba.html">CSS Templates</a></h3>
   </li>
   <li>
     <h3><a href="prueba.html">CSS Layouts</a></h3>
   </li>
   <li>
     <h3><a href="prueba.html">CSS Books</a></h3>
   </li>
  </ul>
 </div>
   
</div>
 

Lo que quiero es que, cuando pulse una upcion de la lista, que se quede marca esa opcion, es decir, si marco la opcion CSS Templates, al carga la pagina, CSS Templates quedaría con un fondo rojo, por ejemplo, y las otras dos opciones de la lista (CSS Layouts y CSS Books), quedarían con su fondo original.

Espero haberme explicado.

Gracias. Un saludo.