El resto de propiedades las poníamos en la hoja de estilos y tenemos escrito esto referente a los enlaces

a{color: #352c23; font-size:1.2em ; text-decoration: none}
a: link{}
a:visited{}
a:hover{color:#f2cc7b; font-size:1.2em; text-decoration:underline}
a:active{}

Vamos a seguir ampliando estos conceptos. Si nos fijamos en las diferentes páginas webs que hay en la red vemos que el aspecto de todos los enlaces no son idénticos, por ejemplo, algunos lo dejan subrayado y dentro de la misma página otros no, unos tratan el enlace como un bloque y con solo acercarte al texto del enlace del menú se activa la opción de enlace, el nuestro tenemos que ponernos exactamente encima de la palabra que enlaza para que se vea el mismo.

***

Estilo para mi menú vertical

Cuando queremos aplicar enlaces con estilos diferentes en la zona del menú, navegación, pie o contenido tendríamos que añadirle una característica a esa etiqueta, igual que hacíamos con el texto o con una imagen y que le habíamos llamado class centrado, pues en los enlaces igual, vamos a crear el estilo enlacemenu especial para los enlaces de ese apartado y en todos los enlaces que ya tenemos puestos en ese bloque le añadimos class="enlacemenu", mirar la captura

Aunque lo veáis en en varias filas recordar que todos los  li deben ir seguidos , en la misma fila y sin espacio entre ellos

Yo quiero que todos los enlaces de mi menú vertical se activen como bloques y no tener que situarme exactamente encima de la palabra enlace para que funcione, así que abrimos la hoja de estilos y creamos ese apartado y al igual que teniamos las propiedades del enlace a , ahora ponemos debajo las propiedades de los enlaces a.enlacemenu entre llaves claro

Observar que le puse las mismas propiedades que tenia antes, solo le añado el display block para que lo reconozca como bloque y no como palabra

a.enlacemenu {color: #352c23; font-size:1.2em ; text-decoration: none; display:block}
a.enlacemenu : link{}
a.enlacemenu :visited{}
a.enlacemenu :hover{color:#f2cc7b; font-size:1.2em; text-decoration:underline}
a.enlacemenu:active{}

***

Estilo para mis enlaces del Pie

Voy a darle ahora mis propiedades a los enlaces del pie, también los quiero en bloques, pero esta vez no quiero que cambie al mismo color que tiene el menú, parece como si desapareciera, así que le pongo otro tono mas oscuro para esos enlaces, el class ahora lo llamaré enlacepie y le añado eso a mis enlaces del pie, insisto, que aunque lo veáis en varias filas lo pondremos todo en la misma línea

Nuestra vista previa ahora seria esta: AQUI

***

Tutorial realizado por EnergiaElca