The :hover pseudo-class applies while the user takes mouse on an element. Note that user may not click on it. Using :hover one can change background color or some other style of element.
Some ways hover can be used
- :hover
- a:hover
- .classname:hover
- div.classname:hover
- #id:hover
- div#id:hover
Example – css :hover
<style type="text/css">
a:hover {
background-color: lightgreen;
}
div {width: 100px; height: 100px;}
div:hover {
border: 1px solid lightgreen;
}
</style>
<a href="/">Hover this link</a><br/><br/>
<div>hover this div</div>
Related
- CSS pseudo class :link - style for unvisited links
- CSS pseudo class :visited - style for visited links
- CSS pseudo class :active
- CSS pseudo class :focus
