Como estilizar links com css

Postado: 10 de março de 2021

Neste artigo Veja Como estilizar links com css.

Cascading Style Sheets (CSS) é um mecanismo para adicionar estilo (cores, fontes, espaçamento, etc.) a um documento web.

O código CSS pode ser aplicado diretamente nas tags ou ficar contido dentro das tags <style>. Também é possível, em vez de colocar a formatação dentro do documento, criar um link para um arquivo CSS que contém os estilos.

No entanto se quiser alterar a aparência dos documentos vinculados a este arquivo CSS. basta modifica-lo.

Com a variação de atualizações dos navegadores, o suporte ao CSS pode variar.

Portanto interpretação dos navegadores pode ser avaliada com o teste Acid2, que se tornou uma forma base de revelar quão eficiente é o suporte de CSS, além disso fazendo com que a nova versão em desenvolvimento do Firefox seja totalmente compatível a ele, assim como o Opera já é.

No entando Doctype informado ou a ausência dele determina o quirks mode ou o strict mode.

modificando o modo como o CSS é interpretado e a página desenhada.

O link é o recurso que permite criarmos um local que, se clicado, abrirá uma outra página.

Normalmente, ao posicionarmos o ponteiro do mouse sobre um link o formato do ponteiro muda de uma seta para uma mão com o indicador estendido.

Veja como estilizar links com css utilizando: cores, fundos.

a:link Define o estilo do link no estado inicial;

a:visited – Define o estilo do link visitado pelo usuário;

a:hover – Define o estilo do link quando o usuário passa-se o mouse sobre ele;

a:active – Define o estilo do link ativo ouseja, quando um elemento está sendo ativado por um usuário

a:focus – Define o estilo do link só quando Clicado.

outras propriedades que podemos utilizar nos links:

text-decoration:none; ( retira o sublinhado )

text-decoration:underline; ( coloca um sublinhado )

text-decoration:overlin; (coloca um sobrelinhado)

text-decoration:underline-overline; ( coloca sobre e sublinhado juntos)

text-decoration:line-through; ( coloca uma linha em cima do texto)

Publicado por: loopnerd

826 Visualizações

Tags ,,

Deixe um comentário

O seu endereço de e-mail não será publicado.