CSS HTML Javascript jQuery Ajax PHP Example Java MORE

CSS Links

❮ Previous Next ❯
    In HTML
  1. by default links are underlined.
  2. Before clicking on a link the color is blue.
  3. After clicking or visiting the color will be Purple.
  4. When we hover the mouse arrow icon changed to a hand icon.
  5. Active links are red.

You can change the style of a link using CSS.

text-decoration property

The text-decoration property is used to remove or add underline from the link.

Example:

<!DOCTYPE html>
<html>
<head>
<style>
.nounderline {
  text-decoration: none;
}

.underline {
  text-decoration: underline;
}
</style>
</head>
<body>

<a href="https://www.studentstutorial.com/" class="underline">Underline link</a>
<br>
<br>
<a href="https://www.studentstutorial.com/" class="nounderline">None Underline link</a>

</body>
</html>
Background Color 

The background-color property used to add a background-color for links.

<!DOCTYPE html>
<html>
<head>
<style>
a:link {
  background-color: yellow;
}

a:visited {
  background-color: cyan;
}

a:hover {
  background-color: lightgreen;
}

a:active {
  background-color: green;
} 
</style>
</head>
<body>

<h3><b><a href="https://www.studentstutorial.com/" target="_blank">Student Tutorial</a></b></h3>


</body>
</html>

Run it yourself

❮ Previous Next ❯