Enlaces sin línea de subrayado

jorge25 · #1 (**permalink**) 20/09/2006, 09:14

Saludos.

Disculpen, quiero crear una clase para asignarla a un enlace o link, pero que éste no muestre la línea de subrayado.

Gracias por alguna sugerencia.

JavierB · #2 (**permalink**) 20/09/2006, 09:19

Hola jorge25

¿Has mirado en las FAQs?

Saludos,

jorge25 · #3 (**permalink**) 20/09/2006, 09:29

Cita:

Iniciado por JavierB

Hola jorge25

¿Has mirado en las FAQs?

Ok, gracias.

jorge25 · #4 (**permalink**) 20/09/2006, 10:44

Bueno, he leido las FAQs y la forma de harcerlo colocando el código entre las etiquetas <HEAD> y </HEAD> de la página:

Código:

<style type="text/css">
a:link {text-decoration:none}
a:visited {text-decoration:none}
a:hover{text-decoration:none}
a:active{text-decoration:none}
</style>

Pero yo lo que quiero es hacer una clase para asignarla a la etiqueta <BODY>. He intentado de algunas maneras pero no me funciona. Por ejemplo:

Código:

.enlace {
	a:link text-decoration:none;
	a:visited text-decoration:none;
	a:hover text-decoration:none;
	a:active text-decoration:none;
	a:text-decoration:none;
}

Esto no me funciona. ¿Hay alguna forma de hacerlo como yo pienso? Gracias.

(En una hoja de estilo aparte)

fearlex · #5 (**permalink**) 20/09/2006, 12:12

Bien puede ser asi:

Cita:

a.enlace:link {text-decoration:none;}
a.enlace:visited { text-decoration:none;}
a.enlace:hover {text-decoration:none;}
a.enlace:active {text-decoration:none;}

o asi

Cita:

a.enlace:link, a.enlace:visited, a.enlace:hover, a.enlace:active {
text-decoration:none;
}

para ello tienes que agregarle la clase al elemento que quieras, ejemplo:

Cita:

<span class="enlace"><ol>
<li><a href="pagina1">boton1</a></li>
<li><a href="pagina2">boton2</a></li>
<li><a href="pagina3">boton3</a></li>
<li><a href="pagina4">boton4</a></li>
</ol>
</span>

ten en cuenta que "a" es un selector o elemento, y :visited, :hover, etc son seudo clases, por lo tanto para declarar clases a los links, tienes que ponerlos entre el selector y la seudo clase, o sea entre "a" y :visited, :hover, :link, etc.

Espero haberte sido de ayuda

jorge25 · #6 (**permalink**) 20/09/2006, 15:47

Cita:

Iniciado por fearlex

Espero haberte sido de ayuda

Gracias por tu respuesta, me funcionó.

Ahora otra cosa que quiero y que hice, es que el enlace tenga la línea debajo cuando el cursor del ratón esté sobre el link. Perfecto, pero cuando es visitado, deja de aparecer onMouseOver (por decirlo así) ¿?

He probado de varias formas pero nada, de hecho todas están "underline" exepto la propiedad visited y no me muestra la línea debajo.

fearlex · #7 (**permalink**) 20/09/2006, 20:58

Bien puede ser asi:

Cita:

a.enlace:link {text-decoration:none;}
a.enlace:visited { text-decoration:none;}
a.enlace:hover {text-decoration:underline;}
a.enlace:active {text-decoration:underline;}

o asi

Cita:

a.enlace:link, a.enlace:visited { text-decoration:none; }

a.enlace:hover, a.enlace:active {text-decoration:underline; }

Espero haberte sido de ayuda

jorge25 · #8 (**permalink**) 21/09/2006, 07:37

Cita:

Iniciado por fearlex

Bien puede ser asi:

Cita:

a.enlace:link {text-decoration:none;}
a.enlace:visited { text-decoration:none;}
a.enlace:hover {text-decoration:underline;}
a.enlace:active {text-decoration:underline;}

Funciona de esa manera, pero una vez que el enlace ha sido visitado, deja de mostrar la línea debajo cuando está el cursor del ratón sobre él.

fearlex · #9 (**permalink**) 22/09/2006, 06:50

NO creo que puedas lograr eso que quieres con CSS, de todas formas, espero estar equivocado :D