EN
CSS - text underline on hover
0
points
In this article, we would like to show you how to underline text on hover event using CSS.
Quick solution:
div:hover {
text-decoration: underline;
}
The :hover
CSS pseudo-class is triggered when the user hovers over an element with the cursor, changing the element style to the one specified within curly brackets.
Practical example
In this example, we add on-hover text underline to the div
element using div:hover
pseudo-class with text-decoration
property set to underline
.
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<style>
div:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div>Hover me to underline.</div>
</body>
</html>