::cue (:cue)

:: cue CSS伪元素匹配所选元素中的WebVTT提示。这可以用于在VTT轨道的媒体中使用字幕和其他线索。

只有CSS一小部分属性可以与 :: cue 伪元素一起使用:

属性应用于整个提示集,就像它们是单个单元一样。唯一的例外是背景及其简写属性可以单独应用于每个提示,以避免创建框并遮盖意外大面积的媒体。

语法


::cue | ::cue( <selector> )

示例

以下CSS设置提示样式,使文本为白色,背景为半透明黑盒。


::cue {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.6);
}

规范

规范 状态 注解
WebVTT: The Web Video Text Tracks Format Candidate Recommendation Initial definition

浏览器兼容性

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
::cueChrome Full support 26Edge No support NoFirefox Full support 55
Notes
Full support 55
Notes
Notes Firefox currently does not support a parameter on ::cue.
Notes Correct limitations to the CSS properties permitted within ::cue were implemented in Firefox 69. See Permitted properties for a list of the allowed properties.
IE No support NoOpera Full support 15Safari Full support 6.1WebView Android Full support ≤37Chrome Android Full support 26Firefox Android Full support 55
Notes
Full support 55
Notes
Notes Firefox currently does not support a parameter on ::cue.
Opera Android Full support 14Safari iOS Full support 6.1Samsung Internet Android Full support 1.5

Legend

Full support  
Full support
No support  
No support
See implementation notes.
See implementation notes.

参考