::cue

El pseudo-elemento CSS ::cue señala las pistas de texto WebVTT dentro del elemento seleccionado. Esto puede ser usado para estilizar subtítulos y otras pistas de texto multimedia con pistas de texto.

::cue {
  color: yellow;
  font-weight: bold;
}

Las propiedades son aplicadas al cojunto completo de anotaciones como si fuesen una unidad. La única excepción es que background y sus versiones largas se aplican a cada pista de texto individualmente para evitar crear cajas y oscurecer inesperadamente grandes partes de los archivos multimedia.

Sintaxis

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

Propiedades permitidas

Las reglas cuyos selectores incluyen este elemento solo pueden usar las siguientes propiedades CSS:

Ejemplos

Estilizando las anotaciones WebVTT como blanco sobre negro

El siguiente CSS ajusta el estilo de las anotaciones para que el texto sea blanco y el fondo sea una caja negro translúcido.

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

Especificaciones

Especificacion Estado Comentario
WebVTT: The Web Video Text Tracks Format
La definición de '::cue' en esta especificación.
Candidate Recommendation Definición inicial.

Compatibilidad con los navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome para AndroidFirefox para AndroidOpera para AndroidSafari en iOSSamsung Internet
::cueChrome Soporte completo 26Edge Soporte completo 79Firefox Soporte completo 55
Notas
Soporte completo 55
Notas
Notas From Firefox 69, only allowed properties apply to the ::cue pseudo-element with no argument. See Permitted properties for a list of the allowed properties.
IE Sin soporte NoOpera Soporte completo 15Safari Soporte completo 6.1WebView Android Soporte completo ≤37Chrome Android Soporte completo 26Firefox Android Soporte completo 55Opera Android Soporte completo 14Safari iOS Soporte completo 6.1Samsung Internet Android Soporte completo 1.5
::cue(<selector>)Chrome Soporte completo 26Edge Soporte completo 79Firefox Sin soporte NoIE Sin soporte NoOpera Soporte completo 15Safari Soporte completo 6.1WebView Android Soporte completo ≤37Chrome Android Soporte completo 26Firefox Android Sin soporte NoOpera Android Soporte completo 14Safari iOS Soporte completo 6.1Samsung Internet Android Soporte completo 1.5

Leyenda

Soporte completo  
Soporte completo
Sin soporte  
Sin soporte
Ver notas de implementación.
Ver notas de implementación.

Ver también