Ir para conteúdo
Fórum Script Brasil
  • 0

TROCAR COR DE UMA PALAVRA AO PASSAR O MOUSE EM UMA FRASE


DieGo_PaPiTo

Pergunta

5 respostass a esta questão

Posts Recomendados

  • 0

Isso é feito com CSS

No caso desse site, foi feito somente para links, mas é possível fazer com outros elementos da página (versões inferiores ao IE7 apenas suportam essa funcionalidade em links, sendo necessário recorrer a javascript)

Você pode fazer assim:

A:link{color:black} /*Link's normais*/
A:visited{color:purple} /*Link's visitados*/
A:hover{color:red} /*Mouse em cima do link*/
A:active{color:green} /*O usuário clicou no link*/

Link para o comentário
Compartilhar em outros sites

  • 0

Valeu Jonathan

mas isso nem foi feito em css fera, é um js que troca imagens ao passar o mouse.

fiz parecido assim .. (não consegui colocar um codebox)

<html>

<head>

<style type="text/css">

a { text-decoration:none; color:#000000; }

a.green { font-weight:bold; color:#000000; }

a.green:hover { color:#66cc00; }

</style>

</head>

<body>

<a href="teste.html">Frase em preto </a><a href="teste.html" class="green">palavra em verde</a><a href="teste.html"> Resto da frase em preto</a>

</body>

</html>

Mas é óbvio q vai funcionar apenas na palavra que esta atribuida a classe "green". Quria q ela trocasse de cor quando passasse fora da palavra.

Alguém sabe?

Link para o comentário
Compartilhar em outros sites

  • 0

Tente escrever manualmente [code] ou [odebox (no caso de códigos pequenos é melhor usar o code)

Você pode deixar o HTML assim:

<a href="pagina2.htm">Visitar <span class="pl_principal">segunda página</span> agora</a>
E o CSS assim:
A.pl_principal:hover {color:red}

Nesse caso só irá mudar a cor da classe "pl_principal"

Obs.:

Isso aí é CSS, não JS

Link para o comentário
Compartilhar em outros sites

  • 0

<hmtl>
<head>
<style type='text/css'>
A.cor:link { color:green; text-decoration:none;}
A.cor:visited { color:green; text-decoration:none;}
A.cor:hover { color:red; text-decoration:none;}
A.cor:active { color:green; text-decoration:none;}
</style>
</head>
<body>
<h2><font color='black'> Clique na palavra para </font><a href='#' class='cor'> MUDAR DE COR </a></h2>
</body>
</html>

Até Mais Y

Editado por DeeKilleer
Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...