CSS Links (Link)

I link o gli hyperlink connettono una pagina Web di risorsa a un'altra pagina Web di risorsa.

Stile link CSS

I link hanno quattro stati diversi - link, visitato, attivo e hover. Questi quattro stati degli hyperlink possono essere utilizzati per definire stili diversi attraverso l'elemento di collegamentopseudo-classiImposta diversi stili attraverso le proprietà CSS, a seconda del loro stato.

Questo è collegato a HTML <a>Marcare i pseudo-classi associati, che possono essere utilizzati per definire stili diversi per gli hyperlink in diverse condizioni.

• a:link — Imposta lo stile del link normale o non visitato che non ha il puntatore del mouse.

• a:visited- Imposta lo stile del link che è stato visitato ma non ha il puntatore del mouse.

• a:hover — Imposta lo stile del link quando l'utente posiziona il puntatore del mouse sopra di esso.

• a:active- Imposta lo stile per il link che si sta cliccando.

Puoi specificare le proprietà CSS che desideri, ad esempio:color,font-family,backgrounde simili, con questi.ScegliereRidefinire lo stile dei collegamenti, come se fossero testi normali.

a:link　{　　　　/*　Collegamento non visitato　　　*/
　　　　color:　#FF0000;
　　　　text-decoration:　none;
}
a:visited　{　　　　/*　Collegamento visitato　*/
　　　　color:　#00FF00;
}
a:hover　{　　　　/*　Mouse sopra il collegamento　*/
　　　　color:　#FF00FF;
　　　　text-decoration:　underline;
}
a:active　{　　　　/*　Collegamento in click　*/
　　　　color:　#0000FF;
}

L'ordine di impostazione delle stili per più stati dei collegamenti è molto importante perché l'ultimo definito ha la priorità sugli altri codici CSS precedenti.

Stile predefinito dei collegamenti

In tutti i browser web mainstream, se non vengono impostati stili specifici, i collegamenti nelle pagine web hanno sottolineature e utilizzano i colori predefiniti del browser.

Ad esempio, il colore predefinito dei collegamenti per i browser web basati su Gecko (come Firefox) è - BluRappresenta il collegamento non visitato,ViolettoRappresenta il collegamento visitato,RossoRappresenta il collegamento che si sta cliccando.

Impostare il colore dei collegamenti

Di seguito è riportato un esempio su come impostare i colori dei collegamenti.

a:link　{　　　　/*　Collegamento non visitato　*/
　　　　color:　#FF0000;
}
a:visited　{　　　　/*　Collegamento visitato　*/
　　　　color:　#00FF00;
}
a:hover　{　　　　/*　Mouse sopra il collegamento　*/
　　　　color:　#FF00FF;
}
a:active　{　　　　/*　Collegamento in click　*/
　　　　color:　#0000FF;
}

Rimuovere la sottolineatura predefinita dai collegamenti

text-decoration Le proprietà CSS generalmente vengono usate per rimuovere la sottolineatura predefinita dai collegamenti. Esempio seguente dimostra come rimuovere o impostare le proprietà di text-decoration per diversi stati dei collegamenti.

a:link　{　　　　/*　Collegamento non visitato　*/
　　　　color:　#FF0000;
　　　　text-decoration:　none;
}
a:visited　{　　　　/*　Collegamento visitato　*/
　　　　color:　#00FF00;
　　　　text-decoration:　none;
}
a:hover　{　　　　/*　Mouse sopra il collegamento　*/
　　　　color:　#FF00FF;
　　　　text-decoration:　underline;
}
a:active　{　　　　/*　Collegamento in click　*/
　　　　color:　#0000FF;
　　　　text-decoration:　underline;
}