Re: [Ovillo] Menu resaltado

Tue, 10 Mar 2009 21:42:46 -0700 

hola! perdon por la demora, estuve ausente todo el dia, ahi te paso el
codigo que yo tengo:


HTML:
<div class="reflejo" ><!--2-->
<ul>
<li class="current"> <a href="index.html"><span>La Instituci&oacute;n
&nbsp;&nbsp;/</span></a></li>
<li> <a href="torneos.html"><span>Torneos &nbsp;&nbsp;/</span></a></li>
<li> <a href="calen2008.html"><span>Torneos 2008 - Anuario
&nbsp;&nbsp;/</span></a></li>
<li> <a href="ranking.html"><span>Ranking &nbsp;&nbsp;/</span></a></li>
<li> <a href="galeria1.html"><span>Galer&iacute;a de Fotos
&nbsp;&nbsp;/</span></a></li>
<li> <a href="contacto.html"><span>Cont&aacute;ctenos
&nbsp;&nbsp;/</span></a></li>
</ul><!-- menunav-->
</div><!--fin 2-->

 En este caso yo tengo un menu horizontal, fijate que la primer linea (1),
tiene una clase current, esta clase, se lo pones en cada pagina, en el link
que le corresponde, por ejem: en contacto.html, esta clase la tiene el link
contacto, en soluc.html, esta clase la tien soluc, se entiende?, no se
repite en todas, solo en la que quieres resaltar

CSS:
.reflejo ul{list-style:none;
        margin:0 auto;

   }

.reflejo li {float:left;
            list-style:none;

   }

.reflejo li a{float:left;
              display:block;
              color:#000;
              text-decoration:none;
              font:.8em 'Lucida Sans', sans-serif;
              font-weight:bold;
              padding:0 0 0 10px;
              margin-bottom:6px;
              height:30px;
              line-height:30px;
              text-align:center;
              cursor:pointer;
}

.reflejo li a span{float:left;
                   display:block;
                      padding:0 0 0 10px;

}

.reflejo li.current a{color:#663300;
                      padding-left:5px;

}


.reflejo li.current a span{color:#663300;
                           padding-left:5px;

}

.reflejo li a:hover{color:#999999;
                   }

.reflejo li a:hover span{color:#999999;


}


Bueno, me avisas cuando lo pruebas, nos vemos

y disculpa si algo no esta claro, estoy medio dormida

Alejandra
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://lists.ovillo.org/mailman/listinfo/ovillo

Responder a