hover CSS media feature can be used to test whether the user's primary input mechanism can hover over elements.

句法

hover feature is specified as a keyword value chosen from the list below.

none

The primary input mechanism cannot hover at all or cannot conveniently hover (e.g., many mobile devices emulate hovering when the user performs an inconvenient long tap), or there is no primary pointing input mechanism.

hover

The primary input mechanism can conveniently hover over elements.

范例

HTML

<a href="#">Try hovering over me!</a>
					

CSS

@media (hover: hover) {
  a:hover {
    background: yellow;
  }
}
					

结果

规范

规范 状态 注释
Media Queries Level 4
The definition of 'hover' in that specification.
候选推荐 初始定义。

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据
Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
hover media feature Chrome 完整支持 38 注意事项
完整支持 38 注意事项
注意事项 Before Chrome 41, the implementation was buggy and reported (hover: none) on non-touch-based computers with a mouse/trackpad. See bug 441613 .
Edge 完整支持 12 Firefox 完整支持 64 IE 不支持 No Opera 完整支持 28 Safari 完整支持 9 WebView Android 完整支持 38 注意事项
完整支持 38 注意事项
注意事项 Before Chrome 41, the implementation was buggy and reported (hover: none) on non-touch-based computers with a mouse/trackpad. See bug 441613 .
Chrome Android 完整支持 50 Firefox Android 完整支持 64 Opera Android 完整支持 28 Safari iOS 完整支持 9 Samsung Internet Android 完整支持 5.0

图例

完整支持

完整支持

不支持

不支持

见实现注意事项。

见实现注意事项。

元数据

  • 最后修改: