Dupa cum stiti (sau nu) cu CSS putem formata si stiliza textul intr-o pagina web in nenumarate feluri. Acum ne vom ocupa de stilizarea linkurilor. Pentru acest lucru avem nevoie de cateva proprietati ale linkurilor si anume: a:hover si a . Prima proprietate reprezinta trecerea cursorului peste link.

Aceste doua stari ale unui hyperlink le putem imbina cu diferite formatari CSS pentru a integra mai bine linkurile in designul nostru sau pentru a da acestora tot felul de efecte.

In continuare sunt cateva exemple de stilizare a linkurilor (codul CSS si efectul produs):

a {color: green;}
a:hover {color: red;}

a {}
a:hover {font-size: big;}

a {text-decoration:none;}
a:hover {text-decoration:none;}

 a {text-decoration:none;background: silver; color: black; padding: 5px;}
a:hover {text-decoration:none;background: black; color: white; padding: 5px;}

a {text-decoration:none;background: silver; color: black; padding: 5px;}
a:hover {text-decoration:none;background: black; color: white; padding: 5px; cursor: help;}

Dupa cum vedeti se pot implementa tot felul efecte pentru linkuri. Putina imaginatie si iese ceva frumos.

De obicei in Internet Explorer si Firefox in momentul in care apasam pe un link (link text sau link imagine) este inconjurat de un border punctat.

Cum facem sa scapam de acest border al linkului? Este foarte simplu: formatam linkurile de pe pagina cu CSS.

a:active, a:focus{
    outline: none; /*sau outline:0;*/
}

a:active = cand se apasa butonul mouseului
a:focus = cand se elibereaza butonul mouselui