underline is displayed when you mouse over a link


(hover) text-decoration: underline;

Browser
Internet Explorer Firefox Opera

The text-decoration property adds decoration to text.

When you set this property with pseudo-classes for the A element, the underline of the link can be displayed according to the state of the link.

In the following examples, the underline is displayed only when you mouse over the link.
(When this style is set, the default underline must be removed. (removes the links underline))


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


Property Value Explanation
text-decoration underline horizontal line under the text

Example

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

<style type="text/css">

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

</style>

</head>
<body>

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

</body>
</html>
Output