1

Estou usando o Pseudo Classe para links, entendi o conceito e a utilização das a:hover a:active and a:visited , porém não consigo entender o a:link. Qual é a utilização dela? Se possível gostaria de um exemplo prático dessa classe .

1 Resposta 1

0

"A pseudo-class CSS :link permite que você selecione os links dentro de um elemento. Ela seleciona todos os links, até mesmo os que não foram visitados, incluindo os links já estilizados em outras classes ou ids com o :hover, :active ou :visited. Para um funcionamento adequado é essencial que ela venha antes das regras: :visited:hover:active. O :focus é uma pseudo-class geralmente usada antes de a:hover ou depois, dependendo do resultado esperado." Fonte: https://developer.mozilla.org/pt-BR/docs/Web/CSS/:link

Resumindo Na maioria dos Browser o cor do link padrão é Azul. Para mudar isso vc pode usar o :link essa é a pseudo-classe para customizar o link padrão, link não visitado, e essa pseudo-classe deve vir antes de todos as outras pseudo-classes referentes ao link.

Exemplos:

/* cor do link não visitado */
a:link {
    color: red;
}

/* cor do link visitado */
a:visited {
    color: green;
}

/* cor do mouse over no link */
a:hover {
    color: hotpink;
}

/* cor do link quando ativo */
a:active {
    color: blue;
}
<a href="default.asp" target="_blank">Meu link</a>
<p><b>Nota1:</b> a:hover precisa vir antes de a:link e a:visited no CSS para funcionar.</p>
<p><b>Nota2:</b> a:active precisa vir depois a:hover no CSS definition para funcionar.</p>

OBS: Essas são as recomendações da W3C

:link { color: #0000EE; }                          /* cor azul padrão */
:visited { color: #551A8B; }                       /* cor roxa visitado */
:link:active, :visited:active { color: #FF0000; }  /* cor vermelha ativo */
:link, :visited { text-decoration: underline; cursor: pointer; }
a:link[rel~=help], a:visited[rel~=help],
area:link[rel~=help], area:visited[rel~=help] { cursor: help; }

Fonte: https://www.w3.org/TR/html5/rendering.html#non-replaced-elements-phrasing-content

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .