Web/CSS/ current

The :current CSS pseudo-class selector is a time-dimensional pseudo-class that represents the element, or an ancestor of the element, that is currently being displayed. For example in a video with captions which are being displayed by WebVTT.

:current(p, span) {
  background-color: yellow;
}

Syntax

Syntax not found in DB!

Examples

CSS

:current(p, span) { 
  background-color: yellow; 
}

HTML

<video controls preload="metadata">
  <source src="video.mp4" type="video/mp4" />
  <source src="video.webm" type="video/webm" />            
  <track label="English" kind="subtitles" srclang="en" src="subtitles.vtt" default>
</video>

WebVTT

WEBVTT FILE

1
00:00:03.500 --> 00:00:05.000 
This is the first caption

2
00:00:06.000 --> 00:00:09.000 
This is the second caption

3
00:00:11.000 --> 00:00:19.000 
This is the third caption

Specifications

Specification	Status	Comment
Selectors Level 4The definition of ':current' in that specification.	Working Draft	Initial definition.

Browser compatibility

The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

No compatibility data found. Please contribute data for "css.selectors.current" (depth: 1) to the MDN compatibility data repository.