CSS Tutorial 06
Lezione 6: Link
Puoi applicare tutto quello che hai imparato nelle lezioni precedenti anche ai link (cioè, cambiare il colore, i font, la sottolineatura, ecc.). La cosa nuova è che i CSS ti permettono di definire queste proprietà in modo diverso a seconda se il link è stato visitato o no, è attivo o se il cursore è proprio sopra il link. In questo modo è possibile aggiungere un po’ di fantasia ed utili effetti al tuo sito web. Per controllare questi effetti devi usare quella che viene chiamata una pseudo-classe (pseudo-classes).
Cosa è una pseudo-classe?
Una pseudo-classe ti permett di tenere in considerazione condizioni o eventi diversi quando definisci una proprietà e una tag HTML.
Guardiamo un esempio. Come sai, in HTML i link vengono specificati con il tag <a>. Possiamo quindi usare a come selettore nei CSS:
a {
color: blue;
}
Un link può assumere diversi stati. Per esempio, può essere già stato visitato o no. Puoi usare una pseudo classe per asssegnare uno stile diverso ai link visitati e ai link non ancora visitati.
a:link {
color: blue;
}
a:visited {
color: red;
}
Usa a:link e a:visited rispettivamente per i link non ancora visitati e per i link già visitati. I link attivi avranno come pseudo-classe a:active, mentre a:hover verrà usato per definire il cursore sopra il link.
Adesso vedremo in dettaglio ciascuna delle quattro pseudo-classi.
Prosegui la lettura…
