Demó pontozott aláhúzásra - hozd ide az egeret.

Nem igényel semmi nagy trükköt a megoldás, egyszerűen csak keretet kell adni a linknek az alábbi sorral:

border-bottom:  #77445b 2px dotted;

A dotted jelenti, hogy pontozott, ha szagatottat szeretnél, írd át erre: dashed, illetve, ha dupla vonalat, akkor: double. Értelemszerűen a színkód lesz a vonal színe, a 2px pedig a vastagsága. Ajánlott csak a hover résznél használni - tehát akkor jelenik meg, mikor a látogató ráviszi az egeret a linkre.

Ha nincs CSS az oldaladon, itt vannak egészben a kódok, amik jobb/bal oldalon lévő modulba beillesztve működnek is:

Pontozott aláhúzás:
<style type="text/css">
/* itt a linkek tulajdonságait állíthatod be; ez a menü modulra nincs hatással, csak a többi linkre! */
A:link, A:visited /* link tulajdonságai */
    {color: #77445b;
     text-decoration: none;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
A:hover /* ha ráviszed az egeret, ilyen tulajdonságokat vesz fel a link */
    {color: #77445b; 
     cursor: crosshair;
     text-decoration: none;
     border-bottom: #77445b 2px dotted;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
/* ez lényegében ugyanaz, mint a fenti linkkód, viszont ez a menü modulra hat! */
A.menu:link, A.menu:visited /* link tulajdonságai */
    {color: #77445b;
     text-decoration: none;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
A.menu:hover /* ha ráviszed az egeret, ilyen tulajdonságokat vesz fel a link */
    {color: #77445b;
     cursor: crosshair;
     text-decoration: none;
     border-bottom: 77445b 2px dotted;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; } </style>

Szagatott aláhúzás:
<style type="text/css">
/* itt a linkek tulajdonságait állíthatod be; ez a menü modulra nincs hatással, csak a többi linkre! */
A:link, A:visited /* link tulajdonságai */
    {color: #77445b;
     text-decoration: none;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
A:hover /* ha ráviszed az egeret, ilyen tulajdonságokat vesz fel a link */
    {color: #77445b; 
     cursor: crosshair;
     text-decoration: none;
     border-bottom: #77445b 2px dashed;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
/* ez lényegében ugyanaz, mint a fenti linkkód, viszont ez a menü modulra hat! */
A.menu:link, A.menu:visited /* link tulajdonságai */
    {color: #77445b;
     text-decoration: none;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
A.menu:hover /* ha ráviszed az egeret, ilyen tulajdonságokat vesz fel a link */
    {color: #77445b;
     cursor: crosshair;
     text-decoration: none;
     border-bottom: 77445b 2px dashed;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; } </style>

Dupla vonal aláhúzás:
<style type="text/css">
/* itt a linkek tulajdonságait állíthatod be; ez a menü modulra nincs hatással, csak a többi linkre! */
A:link, A:visited /* link tulajdonságai */
    {color: #77445b;
     text-decoration: none;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
A:hover /* ha ráviszed az egeret, ilyen tulajdonságokat vesz fel a link */
    {color: #77445b; 
     cursor: crosshair;
     text-decoration: none;
     border-bottom: #77445b 1px double;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
/* ez lényegében ugyanaz, mint a fenti linkkód, viszont ez a menü modulra hat! */
A.menu:link, A.menu:visited /* link tulajdonságai */
    {color: #77445b;
     text-decoration: none;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; }
A.menu:hover /* ha ráviszed az egeret, ilyen tulajdonságokat vesz fel a link */
    {color: #77445b;
     cursor: crosshair;
     text-decoration: none;
     border-bottom: 77445b 1px double;
     font-family: verdana;
     font-size: 7pt;
     font-weight: none; } </style>