html - 为什么没有用户代理为视频元素实现 CSS 光标样式

标签 html firefox css webkit html5-video

我想弄清楚是否可以更改默认 HTML5 video 元素上 cursor 的 CSS 属性。至此,我的测试已经结束:

  1. 默认情况下,没有用户代理(浏览器)实现cursor: pointer。所以你只剩下正常的操作系统箭头/控制指示符

  2. 当您尝试设置 cursor: pointer 时,仅当光标不在 video 元素中的可点击元素上时,用户代理才会更改光标... 即:播放、暂停、搜索、静音、全屏。

  3. 这似乎与应该发生的事情相反。 video 标签的可点击元素(控制栏、中心播放按钮)应该采用光标样式……或者见鬼,只需将其应用于整个内容即可。

有没有人对此有任何见解?

最佳答案

对于 webkit 你可以定位他们的伪元素

video::-webkit-media-controls-panel

video::-webkit-media-controls-play-button

video::-webkit-media-controls-volume-slider-container

video::-webkit-media-controls-volume-slider

video::-webkit-media-controls-mute-button

video::-webkit-media-controls-timeline

video::-webkit-media-controls-current-time-display

video::-webkit-full-page-media::-webkit-media-controls-panel

video::-webkit-media-controls-timeline-container

video::-webkit-media-controls-time-remaining-display

video::-webkit-media-controls-seek-back-button

video::-webkit-media-controls-seek-forward-button

video::-webkit-media-controls-fullscreen-button

video::-webkit-media-controls-rewind-button

video::-webkit-media-controls-return-to-realtime-button

video::-webkit-media-controls-toggle-closed-captions-button

更新

webkit 伪元素扩展列表:https://gist.github.com/afabbro/3759334

关于html - 为什么没有用户代理为视频元素实现 CSS 光标样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15126921/

相关文章:

css - Firefox 特定的 css 问题(所有版本所有平台): form submit button flies off to the right

javascript - onclick函数javascript

css - Materialise CSS 导航栏搜索已损坏

html - 在不将主菜单设置为默认展开的情况下在移动设备上显示隐藏的二级菜单

html - <li> 不显示

javascript - 如何在 Linux 上的 Firefox 中启用复制到剪贴板?

css - 滚动时动画丢失

html - 使用左侧和右侧的面板创建 Bootstrap 布局

javascript - 网络 worker 不在 firefox 8 中工作,在 firefox 7 中工作

http - 为什么当我输入 http URL 时 firefox 立即请求 https?