Cambiar color de fuente al elegir una opción

[ci2000]

Hola, hice un menú horizontal dónde se muestra una imagen y un texto por cada opción. Al pasar el mouse encima de dicha opción, cambia la imagen y el texto queda con negrita.

No he podido lograr que al ser elegida la opción, la letra quede con otro color, sin embargo la negrita si queda marcada.

Gracias desde ya por las respuestas.
Saludos

Código:

	<div class="menu">
	  <a href="index.php?seccion=inicio&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "inicio") {print "class='actual'";} ?>id="inicio">Inicio</a>	  
	  <a href="index.php?seccion=locales&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "locales") {print "class='actual'";} ?>id="locales">Locales</a>	  
	  <a href="index.php?seccion=nacionales&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "nacionales") {print "class='actual'";} ?>id="nacionales">Nacionales</a>
	  <a href="index.php?seccion=policiales&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "policiales") {print "class='actual'";} ?>id="policiales">Policiales</a>	  
	  <a href="index.php?seccion=deportes&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "deportes") {print "class='actual'";} ?>id="deportes">Deportes</a>
	  <a href="index.php?seccion=sociales&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "sociales") {print "class='actual'";} ?>id="sociales">Sociales</a>
	  <a href="index.php?seccion=funebres&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "funebres") {print "class='actual'";} ?>id="funebres">Fúnebres</a>
	  <a href="index.php?seccion=politica&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "politica") {print "class='actual'";} ?>id="politica">Política</a>
	  <a href="index.php?seccion=rurales&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "rurales") {print "class='actual'";} ?>id="rurales">Rurales</a>
	  <a href="index.php?seccion=cartas&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "cartas") {print "class='actual'";} ?>id="cartas">Cartas</a>
	  <a href="index.php?seccion=columnistas&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "columnistas") {print "class='actual'";} ?>id="columnistas">Columnistas</a>	  
	  <a href="index.php?seccion=varios&fechaedicion=<?=$fechaedicion?>&bi=<?=$bi?>" <? if($seccion == "varios") {print "class='actual'";} ?>id="varios">Varios</a>
	</div>

Código:

.menu a
	{
	display:block;
	background-position:center 5px;
	background-repeat:no-repeat;
	width:80px;
	height:20px;
	float:left;
	font-size:13px;
	color:#FFFFFF;
	text-align:center;
	font-family:Arial;
	text-decoration:none;
	padding:43px 0 0 0;
}
	
.menu .alt { display:none; }
.menu a#inicio { background-image: url(../images/inicio_color.png); background-color:#202020;}
.menu a#locales { background-image: url(../images/locales_blanco.png); background-color:#333333;}
.menu a#nacionales { background-image: url(../images/nacionales_color.png); background-color:#202020;}
.menu a#policiales { background-image: url(../images/policiales_blanco.png); background-color:#333333;}
.menu a#deportes { background-image: url(../images/deportes_color.png); background-color:#202020;}
.menu a#sociales { background-image: url(../images/sociales_blanco.png); background-color:#333333;}
.menu a#funebres { background-image: url(../images/funebres_color.png); background-color:#202020;}
.menu a#politica { background-image: url(../images/politica_blanco.png); background-color:#333333;}
.menu a#rurales { background-image: url(../images/rurales_color.png); background-color:#202020;}
.menu a#cartas { background-image: url(../images/cartas_blanco.png); background-color:#333333;}
.menu a#columnistas { background-image: url(../images/columnistas_color.png); background-color:#202020;}
.menu a#varios { background-image: url(../images/varios_blanco.png); background-color:#333333;}

.menu a:hover {
	font-weight:bold;	
	padding:40px 0 0 0;
	border-bottom-width: 3px;
	border-bottom-style: solid;
}

.menu a#inicio:hover { background-image: url(../images/inicio_blanco.png); border-bottom-color:#F9CD00;}
.menu a#locales:hover {	background-image: url(../images/locales_color.png);	border-bottom-color: #ffffff;}
.menu a#nacionales:hover { background-image: url(../images/nacionales_blanco.png); border-bottom-color:#F9CD00;}
.menu a#policiales:hover { background-image: url(../images/policiales_color.png); border-bottom-color: #ffffff;}
.menu a#deportes:hover { background-image: url(../images/deportes_blanco.png);	border-bottom-color: #F9CD00;}
.menu a#sociales:hover { background-image: url(../images/sociales_color.png); border-bottom-color: #ffffff;}
.menu a#funebres:hover { background-image: url(../images/funebres_blanco.png); border-bottom-color: #F9CD00;}
.menu a#politica:hover { background-image: url(../images/politica_color.png); border-bottom-color: #ffffff;}
.menu a#rurales:hover {	background-image: url(../images/rurales_blanco.png); border-bottom-color: #F9CD00;}
.menu a#cartas:hover { background-image: url(../images/cartas_color.png); border-bottom-color: #ffffff;}
.menu a#columnistas:hover {	background-image: url(../images/columnistas_blanco.png); border-bottom-color: #F9CD00;}
.menu a#varios:hover { background-image: url(../images/varios_color.png); border-bottom-color: #ffffff;}

.actual {
	color:#3300CC;
	font-weight:bold;
}

[ci2000]

¿Nadie sabe cómo solucionar esto?

[Dnielf]

no entiendo muy bien. Pero podría ser así :

Código:

.menu a:hover {
	font-weight:bold;	
	padding:40px 0 0 0;
	border-bottom-width: 3px;
	border-bottom-style: solid;
        color: /* lo que quieras*/
}

[ci2000]

Dnielf, gracias por contestar.

En realidad lo que tu me respondiste hace que al pasar el mouse sobre la opción, la fuente tome el color que le indique.
Lo que necesito es, que luego de hacer click en la opción recién tome el color que le indique.

[jomaruro]

Hola:

Busca información sobre a:active.

Saludos.

[cybernatico]

Puede ser:
menu a:active {color:#cualquiera}
sirve para cambiarle el color en cuanto le das click al enlace
<------------------------------------------------------------->>

o si no:
menu a:visited {color:#cualquiera}
este sirve para cambiar el color cuando ya le diste click, osea cuando ya lo visitaste
<----------------------------------------------------------->>

[cristian_cena]

O también lo podes hacer con javascript.
Si por ejemplo el color de tu enlace es rojo y quieres volverlo azul:

CSS: <style>#mi_id{color:red;}</style>
HTML: <a href="#" id="mi_id" onclick="this.style.color='blue';">soy un enlace</a>