How to use CSS hover inside html-tag? [duplicate]

Question

I want to do something like this:

<li style="hover:background-color:#006db9;">

But it wont work. Is this possible to do in some way, or do I have to write the css in the head or external css-document?

Answer 1

It is not possible with inline styles, but the (in)famous onmouseover / onmouseout event handler can do the same thing.

<li onmouseover="this.style.backgroundColor='#006db9'" onmouseout="this.style.backgroundColor=''">

Caveat: CSS definitions with hyphens have to be translated to Javascript using camelCase, like (css)background-color = (javascript)backgroundColor