:current

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Der :current CSS Pseudoklassen-Selektor ist eine zeitbasierte Pseudoklasse, die ein Element oder einen Vorfahren eines Elements repräsentiert, das aktuell angezeigt wird. Zum Beispiel kann diese Pseudoklasse verwendet werden, um ein Video zu repräsentieren, das mit Untertiteln durch WebVTT angezeigt wird.

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

Syntax

css
:current {
  /* ... */
}

:current(<compound-selector-list>) {
  /* ... */
}

Beispiele

CSS

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

HTML

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

Spezifikationen

Specification
Selectors Level 4
# the-current-pseudo

Browser-Kompatibilität

Kein Browser implementiert diese Funktion.

Siehe auch