The any-hover
CSS @media
media feature can be used to apply styles based on whether any available input mechanism can hover over elements.
Syntax
The any-hover
feature is specified as a keyword value chosen from the list below.
none
- None of the available input mechanism(s) can hover conveniently, or there is no pointing input mechanism.
hover
- One or more available input mechanisms can conveniently hover over elements.
Example
HTML
<a href="#">Try hovering over me!</a>
CSS
@media (any-hover: hover) { a:hover { background: yellow; } }
Result
Specifications
Specification | Status | Comment |
---|---|---|
Media Queries Level 4 The definition of 'any-hover' in that specification. |
Working Draft | Initial definition. |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Edge | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 41 | No support[2] | 20 or earlier (12) | Nightly build | 28 | 9 [1] |
Feature | Android | Chrome for Andorid | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | No support | 50 | No support[2] | 36 | ? | 9.2 |
[1]: Implemented in WebKit bug #134822.
See Also
Document Tags and Contributors
Tags:
Contributors to this page:
mfluehr,
alberts+,
rafrex,
Druzion,
cvrebert,
Sebastianz,
dannyfritz,
kscarfone,
jpmedley
Last updated by:
mfluehr,