MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

::cue (:cue)

The ::cue CSS pseudo-element matches WebVTT cues within the matched element. This can be used specify the styles of captions and other cues within media with VTT tracks.

Only a small subset of CSS properties can be used with the ::cue pseudo-element:

The properties are applied to the entire set of cues as if they were a single unit. The only exception is that backround and its shorthand properties apply to each cue individually, to avoid creating boxes obscuring unexpectedly large areas of the media.

Syntax

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

Example

The following CSS sets the cue style so that the text is white and the background is a translucent black box.

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

Specifications

Specification Status Comment
WebVTT: The Web Video Text Tracks Format Draft Initial definition

Browser compatibility

FeatureChromeFirefoxEdgeInternet ExplorerOperaSafari
Basic Support(Yes)551?(No)??
FeatureAndroidChrome for AndroidEdge mobileFirefox for AndroidIE mobileOpera AndroidiOS Safari
Basic Support???55(No)??

1. Firefox currently does not support a parameter on ::cue.

See also

Document Tags and Contributors

 Contributors to this page: fscholz, Sheppy
 Last updated by: fscholz,