CSS - change link style on mouse hover

0 points
Created by:

In this short article, we would like to show how to change link style on mouse hover using CSS.

Quick solution:

a:hover {
  color: red; 

The :hover CSS pseudo-class is triggered when the user hovers over an element with the cursor (mouse pointer) changing the element style to the one specified within curly brackets.


Practical example

In this example, we change the color of a element to red on the hover event. 

// ONLINE-RUNNER:browser;

<!doctype html>

      a:hover {
        color: red; 

    <a href="">Go to the Dirask homepage.</a>


Native Advertising
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

❤️💻 🙂