Cores Diferentes No Link

Jony Walker · Novembro 22, 2006

Como faço para ter dois estilos de links na mesma página ?? Tipo, um link vai ser sem underline e azul e o outro cinza mas com underline ??

quando altero as propriedades do css direto no a, ele fica predominante para todos os links... as cores eu consigo mudar aplicando outro estilo no link, mas como faço para um ter underline e o outro não ??

fahledu · Novembro 22, 2006

Veja se ajuda:

http://www.maujor.com/tutorial/csslinks.php

Novembro 22, 2006

dexter(exnatan@yahoo.com,br)

Cara me manda o seu codigo html que dou uma olhada e corrigo pra você e te mando o codigo comentado depois que eu enviara pra você eu deixo aqui no forum pra galera tambem falouuuuuuuuuuuuuu

Jony Walker · Novembro 22, 2006

Cara, era isso mesmo, é só seguir o link e vai ter tudo explicado lá...

valewz !!!

Jony Walker · Novembro 22, 2006

p****, eu copiei o código igualzinho e num funcionou absolutamente NADA.... o que pode ser ??

flavio · Novembro 23, 2006

realmente existe um erro no código... quem diria...

<style>
<!--
.classe1 a:link {text-decoration: none}
.classe1 a:visited {text-decoration: none}
.classe1 a:hover {text-decoration: underline; color: #FF0000;}
.classe1 a:active {text-decoration: none}
.classe2 a:link {text-decoration: underline overline}
.classe2 a:visited {text-decoration: underline overline}
.classe2 a:hover {text-decoration: underline; color: #00FF00;}
.classe2 a:active {text-decoration: underline overline}
-->
</style>

Essa definição diz que: Dentro de toda tag tal que CLASS="classe1" , se essta tag contiver uma tag A, então o efeito será aplicado a esta última. Veja a noção de hierarquia. Isso implica que você não deve usar

<a href="http://www.maujor.com" class="classe1">ESTE É O LINK DA classe1</a>

O que deve ser feito é aplicar aquela classe a uma tag pai:

<p class="classe1"><a href="http://www.maujor.com">ESTE É O LINK DA classe1</a></p>

flavio · Novembro 23, 2006

outra forma seria a adotada no código daquela página.

<html>
<head>
<style>
<!--
a.class1:link, a.class1:visited, a.class1:active   {text-decoration: none}
a.class1:hover  {text-decoration: underline; background:transparent; color: red;} 

a.class2:link, a.class2:visited, a.class2:active   {text-decoration: underline overline}
a.class2:hover  {text-decoration: underline; background:transparent; color: green;}
-->
</style>
</head>
<body>
<a href="http://www.maujor.com" class="class1">ESTE É O LINK DA classe1</a><p>
<a href="http://www.maujor.com" class="class2">ESTE É O LINK DA classe2</a>
</body>
</html>

Veja que aqui a hierarquia é diferente.

Jony Walker · Novembro 23, 2006

você tem razão, estava olhando o código-fonte da própria página e os exemplos que funcionam possuem os estilos aplicados dentro das tags <p> e não dentro da <a> como o exemplo sugere...

Obrigado !!

flavio · Novembro 28, 2006

O Maurício (MAUJOR) já corrigiu o erro. Pode conferir lá no site.

Entrar

Cores Diferentes No Link

Pergunta

Jony Walker

Link para o comentário

Compartilhar em outros sites

8 respostass a esta questão

Posts Recomendados

fahledu

Link para o comentário

Compartilhar em outros sites

Guest Visitante

Link para o comentário

Compartilhar em outros sites

Jony Walker

Link para o comentário

Compartilhar em outros sites

Jony Walker

Link para o comentário

Compartilhar em outros sites

flavio

Link para o comentário

Compartilhar em outros sites

flavio

Link para o comentário

Compartilhar em outros sites

Jony Walker

Link para o comentário

Compartilhar em outros sites

flavio

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades