changes the links underline style

border-bottom: ***;

Browser
Internet Explorer Firefox Opera

The border-bottom property is a shorthand property for setting all the bottom border properties.

The underline style of the link can be changed by applying this property for the A element.

When this style is set, the default underline must be removed.
(removes the links underline)

a {
text-decoration: none;
border-bottom: 1px #0000a0 dotted;
}

Property Value Explanation
border-bottom each value the bottom border

border-bottom: 1px #0000a0 dotted;

border-bottom: 1px #0000a0 dotted ;
border-bottom- width color style

Example

<html>
<head>
<title>TAG index</title>

<style type="text/css">

a { text-decoration: none; }

#example1 { border-bottom: 2px #0000ff dotted; }
#example2 { border-bottom: 3px #ff0000 double; }
#example3 { border-bottom: 1px #0000ff dashed; }

</style>

</head>
<body>

<p><a href="index.html" id="example1">Link Styles</a></p>
<p><a href="index.html" id="example2">Link Styles</a></p>
<p><a href="index.html" id="example3">Link Styles</a></p>

</body>
</html>
Output

Link Styles

Link Styles

Link Styles

<html>
<head>
<title>TAG index</title>

<style type="text/css">

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

a:link { color: #0000ff; }
a:visited { color: #0000a0; }
a:hover { color: #ff0000; }
a:active { color: #ff8000; }

</style>

</head>
<body>

<p><a href="index.html">Link Styles</a></p>

</body>
</html>
Output

Link Styles