Assine nosso Feed


Melhores Dicas para Blogueiros

Passe o mouse e veja qual o assunto do tutorial de cada imagem

Alterar cores dos links - CSS


Alterar as cores ou formatar os links que aparecem no blog é muito simples de fazer, basta editar o estilo CSS e pronto, todos os links da pagina mudam de uma vez só, mas uma coisa que atrapalha muita gente é o estilo a:visited, isso é o estilo(formatação de texto) dos links já visitados, mas podemos alterar ou mesmo remover isso do blog e assim deixando todos os links iguais.

A formatação dos links funciona da seguinte maneira:

a:link {color: #0000ff}
a:visited {color: #000000}
a:hover {color: #ff0000}

a:link normal do link, cor azul
a:visited links que você já visitou, cor preta
a:hover quando o mouse está sobre o link, cor vermelha

Então os links que já foram visitados terão uma aparência diferente seguindo a formatação de texto (cores, tamanho...) do estilo da segunda linha, muita gente corrigi isso fazendo uma formatação igual a da primeira linha, mas isso não é necessário, poderíamos excluir a segunda linha e retirar o trecho :link da primeira, ficando deste jeito:

a{ color: #0000ff }
a:hover{ color: #ff0000}

Aqui temos apenas duas opções para os links: na primeira linha a aparência normal dos links (azul) e na segunda a formatação (vermelho) para quando o mouse estiver sobre o link. Essas cores naturalmente são apenas exemplos, você pode usar as formatações de texto que desejar, colocar bordas, inclusive deixando os links com aparência de botões.

Acho que essa é uma das maneiras mais simples de resolver o problema de cores diferentes entre os links que aparecem no seu blog. Mas claro isso é uma questão de opinião de cada um se você achar útil os links já clicados parecerem diferentes então aproveite esse tutorial apenas para saber como modificar e personalizar os links. Related Posts with Thumbnails
Link desta página
Comentários
22 Comentários

22 Comentários:

Baixando na WEB disse...

Fabiano,

Muito bom este artigo!

Já vi diversas pessoas perguntando como fazer para os links ficarem azuis e vermelhos quando o mouse estiver sobre os links, este artigo ajudará muitas pessoas.

Um grande abraço a parabéns pelo seu trabalho.

Isaura Mirela disse...

Oi! Como faço para colocar um link na minha postagem, mas sendo que apareça, por exemplo, clique aqui ou o nome do site e não a url?

Obrigada desde já.

Fabiano Roberto disse...

o código do link é assim:

<a href='http://www.dicasparablogs.com.br/2010/09/alterar-cores-dos-links-css.html' target='_blank'>Alterar cores dos links - CSS</a>

na pagina de postagem selecione o texto e clique no icone de link na barra emcima da baixa de postagem

Gisele disse...

Olá...Minha pergunta é a mesma da Isaura Mirela...
Porém li a sua explicação e não entendi...

Como faço para colocar um link na minha postagem, mas sendo que apareça, por exemplo, clique aqui ou o nome do site e não a url?

Agradeço desde já e estarei esperando a resposta pois tenho tentado e não consigo...

Fabiano Roberto disse...

o código do link é como falei no comentário anterior, só precisa trocar o endereço da pagina e o texto e colocar na postagem que está escrevendo.

ou na pagina de postagem tem uma ferramenta para criar link

Andreza disse...

Tem como deixar um link com cor diferente dos outros?

Fabiano Roberto disse...

Andreza
você quer um link de uma lista com a cor diferente?

se for um lista de links feita em html é possivel editar cada link colocando style="color:#009" assim:

<a style="color:#009" href='http://www.dicasparablogs.com.br/2010/09/alterar-cores-dos-links-css.html' title='Alterar cores dos links - CSS'>Alterar cores dos links - CSS</a>

mas se fizer isso quando quiser trocar a cor deste link terá que editar o código, portanto não é recomendável usar em postagens pois com o passar do tempo esquecemos destas edições e se mudar a cor do fundo, letras ou qualquer coisa no seu blog a cor deste link permanecerá a mesma e pode ficar invisível se você não lembrar de alterar

Andreza disse...

Ah ta, acho que entendi!
Muito obrigada!

Marcos Paulo disse...

valeu me ajudo bastante

everton disse...

oi quero fazer uma parceira contado oslokosamigos.blogspot.com

Maker Downs disse...

Me ajudo pra caramba !! Vlw ae abraçoss..

Oh! doido disse...

Como mudar a cor do alt dos links ?

Fabiano Roberto disse...

o alt não tem como editar... pelo menos não conheço o código

# Vanessa Altoé Cansi εïз disse...

Ei bom dia!
gostaria de fazer Edições no meu blog.
Por exemplo colocar os posts de forma legal.. sem nesta forma Hierarquia, sendo que pudesse mostrar os títulos com imagens..emfim...poderia me ajudar?
Me encontre tb no meu e-mail: vanessa_cansi@hotmail.com

Fabiano Roberto disse...

Vanessa
pode usar o resumo das postagens

Emerson disse...

Valeu Fabiano... obrigado.

Anônimo disse...

Eu não entendi,como faço para trocar de cor os links quando posto o mouse,onde acho esse

a:link {color: #0000ff}
no html?

Fabiano Roberto disse...

@Anônimo só precisa trocar o código da cor #0000ff, veja aqui mais Código das Cores

Lucas Henrique disse...

Eu queria saber como eu mudo a cor de um texto ?
tipo eu coloquei um texo no fim do blog e quero deixar a cor em branco, só que eu não consigo alguem pode tirar essa minha duvida ? ou me respondendo aqui ou mandando um email: lhenriqueg@hotmail.com

Fabiano Roberto disse...

Lucas Henrique
se for um texto somente pode usar um gadget de html/javascript e colocar seu texto dentro deste código

< div style="color:#fff" > texto aqui < / div >

Trollagem Memes disse...

fabiano em que linha coloco esse codigo ?

Fabiano Roberto disse...

depois de body{.... } não tem um lugar exato

Postar um comentário