TechKnack

Ever seen the odd site that, instead of solid or absent underlining, has a dotted or dashed underline? Ever wonder how it’s done? It’s really simple: border-style.

All you need to do to get an alternative underlining effect is to, first off, hide the default underline with text-decoration:none, and then specify a bottom border for the affected links:

a:link {
    text-decoration: none;
    border-bottom: #000 dashed 1px;
}

To make the effect stand out, you could also make the link and border separate colors, either on hover or all the time.