How to change link color when hovering over a link in HTML

Updated: 12/30/2019 by Computer Hope
Web page link color change

Changing the link color when the visitor hovers over a link helps indicate what is clickable on your web page or blog. Make your pages link color change, implement the below code into your <head></head> portion of your HTML or in your CSS code for your web page.

The example below is how to change the link properties of your web page in CSS. If you want to change the link color when moving the mouse over a link, you only need the A:hover line.

<style type="text/css">
A:link { COLOR: black; TEXT-DECORATION: none; font-weight: normal }
A:visited { COLOR: black; TEXT-DECORATION: none; font-weight: normal }
A:active { COLOR: black; TEXT-DECORATION: none }
A:hover { COLOR: blue; TEXT-DECORATION: none; font-weight: none }
</style>

hover - The hover option is the color that the text changes to when the mouse is over the link. In this example, the link changes to a blue color when a mouse cursor is hovering over a link.

Tip

This CSS code can also be inserted in an external CSS file to load on every web page.