Sottolineatura tratteggiata sui link al passaggio del mouse con i Css

Corso online Responsive Design
Realizzare siti responsivi con HTML5 e CSS3.

Scritto da Luca Ruggiero nella sezione Css

Sfortunatamente i Css non dispongono nativamente di un sistema di sottolineatura tratteggiata sui link, ma è possibile arrivare ad un effetto del genere con un minimo di astuzia e con l'utilizzo del box-model!

Si consideri un semplice link

<a href="http://www.lukeonweb.net">Luca Ruggiero</a>
Si inserisca nel foglio di stile delle proprie pagine il seguente codice:
a
{
    color: #000080;
    text-decoration: Underline;
    border-bottom: None;
}
a:hover
{
    color: #000080;
    text-decoration: None;
    border-bottom: Dashed 1px #000080;
}
Ricordo che il bordo tratteggiato Dashed è supportato da Ms Internet Explorer solo dalla versione 5.5 in poi.

I più cliccati della sezione Css

:: Effetto testo barrato con con i Css (49.854)

:: Referenze dei fogli di stile Css (41.897)

:: Menu ad effetto mouseover con i Css (39.283)

:: Effetti sui link con i Css (30.271)

:: Testo verticale coi Css (20.094)

:: Angoli smussati in un box coi Css (18.970)

:: Box con effetto ombra con i CSS3 (16.383)

:: Posizionare un layer centrato rispetto alla risoluzione con i Css (16.287)

:: Stilizzare i form Html con i Css (16.100)

:: CSS Expression, ovvero: integrare Javascript in un foglio di stile (15.887)

IN EVIDENZA
DOWNLOAD