MouseOver and MouseOut In CSS

css, html

Solution

Here is the best solution, i think.

CSS onomouseout:

div:not( :hover ){ ... }

CSS onmouseover:

div:hover{ ... }

It's better, because if you need to set some styles ONLY onmouseout and trying to do this in this way

div { ... }

you will set your styles and for onmouseover too.

Problem

For using mouse into one element we use the `:hover` CSS attribute. How about for mouse out of the element? I added a transition effect on the element to change the color. The hover effect works fine, but what CSS attribute should I use for mouse out to apply the effect? I'm looking for a CSS solution, not a JavaScript or JQuery solution.

Original source