MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

The ::cue CSS pseudo-element matches WebVTT cues within a selected element. This can be used to style captions and other cues in 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 background and its shorthand properties apply to each cue individually, to avoid creating boxes and 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

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

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

See also

Document Tags and Contributors

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