If you do not define the link style, by default, the link will always be underlined.
We can use CSS to format the style.
There are 4 selectors for links:
a:link | defines the style for normal unvisited links. |
a:visited | defines the style for visited links. |
a:active | defines the style for active links. A link becomes active once you click on it. |
a:hover | defines the style for hovered links. A link is hovered when the mouse moves over it. |
These are some of the styles I use:
Solid underlined link | |
No underlined link | |
Dotted underlined link |
I want my links to be underlined when they are at normal state, visited state and also active stated, but no underlined when mouse over it:
a:link, a:visited, a:active
{
color: #2666a6;
text-decoration:underline;
}
a:hover
{
color:#2666a6;
text-decoration: none;
}
If you want to have the dotted underlined links, you may declare it like this.
As there's no text-decoration as dotted underlined, so we make use of the bottom border.
a:link, a:visited, a:active
{
color: #2666a6;
text-decoration:none;
border-bottom:dotted 1px #2666a6;
}
a:hover
{
color:#2666a6;
text-decoration: none;
border-bottom:none;
}
Have fun!!
References: