Links CSS (Links)

Links or hyperlinks are used to connect from one web resource page to another web resource page.

CSS style links

Links have four different states- link, visited, active, and hover. These four states of links or hyperlinks can be used with the anchor element'sPseudo-classesSet different styles through CSS properties, depending on their state.

This is related to HTML <a>Mark the associated CSS pseudo-class, which can be used to define different styles for different states of hyperlinks.

• a:link —Configure the style for common or unvisited links without a mouse pointer.

• a：visited-Definir o estilo do link que o usuário visitou mas não tem o ponteiro do mouse.

• a：hover —Definir o estilo do link quando o usuário colocou o ponteiro do mouse sobre ele.

• a：active-Definir o estilo do link que está sendo clicado.

Você pode especificar os atributos CSS que deseja, por exemplo:color,font-family,backgroundetc., com essesSelecionarRedefinir o estilo do link, como você faria com texto normal.

a:link　{　　　　/*　Link Não Visitado　　　*/
　　　　color: #FF0000;
　　　　text-decoration: none;
}
a:visited　{　　　　/*　Link Visitado　*/
　　　　color: #00FF00;
}
a:hover　{　　　　/*　Quando o Mouse Passa sobre o Link　*/
　　　　color: #FF00FF;
　　　　text-decoration: underline;
}
a:active　{　　　　/*　Link que está sendo Clicado　　*/
　　　　color: #0000FF;
}

A ordem de definição dos estilos para vários estados de links é importante, pois a última definição tem prioridade sobre o código CSS anterior.

Estilo de Link Padrão

Em todos os navegadores da Web populares, se não forem especificados estilos específicos, os links na página da web têm sublinhado e usam a cor padrão do link do navegador.

Por exemplo, o cor padrão do link para os navegadores da Web baseados no Gecko (como o Firefox) é- AzulRepresenta o Link Não Visitado,PúrpuraRepresenta o Link Visitado,VermelhoRepresenta o Link que está sendo Clicado.

Definir a Cor do Link

A seguir estão exemplos de como definir a cor do link.

a:link　{　　　　/*　Link Não Visitado　　*/
　　　　color: #FF0000;
}
a:visited　{　　　　/*Link Visitado　*/
　　　　color: #00FF00;
}
a:hover　{　　　　/*　Quando o Mouse Passa sobre o Link　*/
　　　　color: #FF00FF;
}
a:active　{　　　　/*　Link que está sendo Clicado　*/
　　　　color: #0000FF;
}

Remover a Sublinhada Padrão dos Links

text-decoration Os atributos do CSS geralmente são usados para remover a sublinhada padrão dos links.-Atributos de Diferentes Estados do Hyperlink.

a:link　{　　　　/*　Link Não Visitado　*/
　　　　color: #FF0000;
　　　　text-decoration: none;
}
a:visited　{　　　　/*　Link Visitado　*/
　　　　color: #00FF00;
　　　　text-decoration: none;
}
a:hover　{　　　　/*　Quando o Mouse Passa sobre o Link　*/
　　　　color: #FF00FF;
　　　　text-decoration: underline;
}
a:active　{　　　　/*　Link que está sendo Clicado　*/
　　　　color: #0000FF;
　　　　text-decoration: underline;
}