Languages
[Edit]
EN

CSS - change link style on mouse hover

0 points
Created by:
DrJoystick
315

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>
<html>
  <head>
    <style>

      a:hover {
        color: red; 
      }

    </style>
  </head>
  <body>
    <a href="https://www.dirask.com/">Go to the Dirask homepage.</a>
  </body>
</html>

References

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.

❤️💻 🙂

Join