Pestaña Activa en Css

[abmptc]

Hola,

Estoy haciendo una página asp con pestañas. Para manejar las pestañas estoy usando un archivo Css con la siguiente codificación:

#header
{
width: 100%;
height: 100px;
margin: 0 auto;
padding: 2px 0 0 0;
background: #FFFFFF url(../images/img01_peque.gif) repeat-x;
}

#menu
{
float: left;
padding: 0 0 0 0;
width: 603px;
height: 30px;
}

#menu ul
{
height: 30px;
margin: 0;
padding: 2px 0;
list-style: none;
width: 800px;
}

#menu li
{
display: inline;
}

#menu a
{
display: block;
float: left;
width: 120px;
height: 60px;
padding-top: 12px;
background: url(../images/img03.jpg) no-repeat;
text-align: center;
text-decoration: none;
letter-spacing: -1px;
font-size: 18px;
/* text-transform: lowercase; */
}

#menu a:hover, #menu .active a
{
background-image: url(../images/img04.jpg);
color: #FFFFFF;
}

#menu #current a
{
background-image: blue;
color: red;
}

Con esto código consigo que cuando pasamos el ratón por encima de una pestañas, esta cambie de color. ¿Hay alguna forma de configurar las pestañas con css para que cuando hagamos click con el ratón en una pestaña se quede con un color distinto, para así saber en que pestaña estamos en cada momento?

Muchas gracias de antemano y un saludo.

[IsaBelM]

no, has de usar html dom

[KoswiDigital]

Hola.

También podrías crear un selector de clase css llamado, por ejemplo, "selected" y atribuírselo a la pestaña seleccionada. Por ejemplo:

Código CSS:

#menu a.selected
{
  color: white;
  background: black;
}
 

Código HTML:

<li><a href="#">menu1</a></li>
<li><a class="selected" href="#">menu2</a></li>
 
<!-- Eso sí, en cada página, la sección tiene que tener su class="selected", así que esto puede ser un poco complicado de implementar -->
 

Un saludo.

[IsaBelM]

Iniciado por KoswiDigital

Hola.

También podrías crear un selector de clase css llamado, por ejemplo, "selected" y atribuírselo a la pestaña seleccionada. Por ejemplo:

no funcionará a no ser que use la propiedad HTMLElement className() de html dom

un ejemplo

[KoswiDigital]

Ah, me pasa por no leer correctamente, hablamos de la misma página, no de páginas diferentes. ¡Mis disculpas! Efectivamente, hay que utilizar JavaScript :)