:fullscreen

Übersicht

Die CSS Pseudoklasse :fullscreen betrifft jedes Element, welches sich im Vollbildmodus befindet. Sie selektiert nicht nur das Toplevelelement, sondern den ganzen Stapel an Elementen.

Das W3C empfiehlt das zusammengeschriebene :fullscreen, d. h. ohne Bindestrich, jedoch haben sowohl Gecko als auch Webkit eine Präfixversion mit Bindestrich implementiert : :-webkit-full-screen und :-moz-full-screen. Microsoft Edge und Internet Explorer verwenden die Syntaxen :fullscreen und :-ms-fullscreen.

Beispiele

*:fullscreen {
  position: fixed;
  top: 0; 
  right: 0; 
  bottom: 0; 
  left: 0;
  margin: 0;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
h1:fullscreen {
  border: 1px solid #f00;
}
p:fullscreen {
  font-size: 200%;
}

Spezifikationen

Spezifikation Status Anmerkung
Fullscreen API
Die Definition von ':fullscreen' in dieser Spezifikation.		 Lebender Standard Ursprüngliche Definition

Browser Kompatibilität

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid WebviewChrome für AndroidFirefox für AndroidOpera für AndroidSafari auf iOSSamsung Internet
:fullscreenChrome Vollständige Unterstützung 71
Vollständige Unterstützung 71
Vollständige Unterstützung 15
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-webkit-full-screen
Edge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 64
Vollständige Unterstützung 64
Keine Unterstützung 47 — 65
Deaktiviert
Deaktiviert From version 47 until version 65 (exclusive): this feature is behind the full-screen-api.unprefix.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Keine Unterstützung 9 — 65
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-moz-full-screen
IE Vollständige Unterstützung 11
Mit Präfix
Vollständige Unterstützung 11
Mit Präfix
Mit Präfix Benötigt das Herstellerpräfix: -ms-
Opera Vollständige Unterstützung 58
Vollständige Unterstützung 58
Vollständige Unterstützung 15
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-webkit-full-screen
Safari Vollständige Unterstützung 6
Alternativer Name
Vollständige Unterstützung 6
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-webkit-full-screen
WebView Android Vollständige Unterstützung 71
Vollständige Unterstützung 71
Vollständige Unterstützung 37
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-webkit-full-screen
Chrome Android Vollständige Unterstützung 71
Vollständige Unterstützung 71
Vollständige Unterstützung 18
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-webkit-full-screen
Firefox Android Vollständige Unterstützung 64
Vollständige Unterstützung 64
Keine Unterstützung 47 — 65
Deaktiviert
Deaktiviert From version 47 until version 65 (exclusive): this feature is behind the full-screen-api.unprefix.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Keine Unterstützung 9 — 65
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-moz-full-screen
Opera Android Vollständige Unterstützung 50
Vollständige Unterstützung 50
Vollständige Unterstützung 14
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-webkit-full-screen
Safari iOS Keine Unterstützung NeinSamsung Internet Android Vollständige Unterstützung 10.0
Vollständige Unterstützung 10.0
Vollständige Unterstützung 1.0
Alternativer Name
Alternativer Name Verwendet den nicht standardisierten Namen: :-webkit-full-screen
Select all elements in the fullscreen stackChrome Keine Unterstützung NeinEdge Vollständige Unterstützung 12Firefox Vollständige Unterstützung 43IE Vollständige Unterstützung 11Opera Keine Unterstützung NeinSafari Keine Unterstützung NeinWebView Android Keine Unterstützung NeinChrome Android Keine Unterstützung NeinFirefox Android Vollständige Unterstützung 43Opera Android Keine Unterstützung NeinSafari iOS Keine Unterstützung NeinSamsung Internet Android Keine Unterstützung Nein

Legende

Vollständige Unterstützung  
Vollständige Unterstützung
Keine Unterstützung  
Keine Unterstützung
Benutzer muss dieses Feature explizit aktivieren.
Benutzer muss dieses Feature explizit aktivieren.
Verwendet einen nicht standardisierten Namen.
Verwendet einen nicht standardisierten Namen.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.
Benötigt ein Herstellerpräfix oder einen anderen Namen zur Verwendung.

Siehe auch

Verwandte Themen
  1. CSS
  2. CSS Referenz
  3. CSS Selectors
  4. Handbuch
    1. Using the :target pseudo-class in selectors [Übersetzen]
  5. Eigenschaften
    1. Selector list [Übersetzen]
  6. Basic Selectors
    1. Typselektoren
    2. Klassenselektoren
    3. ID-Selektoren
    4. Universalselektoren
    5. Attributselektoren
  7. Combinators
    1. Angrenzende Geschwisterselektoren
    2. Allgemeine Geschwisterselektoren
    3. Kindselektoren
    4. Descendant combinator [Übersetzen]
    5. Column combinator [Übersetzen]
  8. Pseudo-classes
    1. :active
    2. :any-link [Übersetzen]
    3. :checked [Übersetzen]
    4. :blank [Übersetzen]
    5. :default
    6. :defined [Übersetzen]
    7. :dir()
    8. :disabled
    9. :empty
    10. :enabled
    11. :first
    12. :first-child
    13. :first-of-type
    14. :fullscreen
    15. :focus
    16. :focus-visible [Übersetzen]
    17. :focus-within [Übersetzen]
    18. :has() [Übersetzen]
    19. :host() [Übersetzen]
    20. :host-context() [Übersetzen]
    21. :hover
    22. :indeterminate
    23. :in-range
    24. :invalid
    25. :is() (:matches(), :any()) [Übersetzen]
    26. :lang
    27. :last-child
    28. :last-of-type
    29. :left [Übersetzen]
    30. :link
    31. :not()
    32. :nth-child
    33. :nth-last-child() [Übersetzen]
    34. :nth-last-of-type() [Übersetzen]
    35. :nth-of-type() [Übersetzen]
    36. :only-child
    37. :only-of-type [Übersetzen]
    38. :optional
    39. :out-of-range
    40. :placeholder-shown [Übersetzen]
    41. :read-only [Übersetzen]
    42. :read-write [Übersetzen]
    43. :required
    44. :right [Übersetzen]
    45. :root
    46. :scope [Übersetzen]
    47. :target [Übersetzen]
    48. :valid [Übersetzen]
    49. :visited
    50. :where() [Übersetzen]
  9. Pseudo-elements
    1. ::-moz-progress-bar
    2. ::-moz-range-progress [Übersetzen]
    3. ::-moz-range-thumb [Übersetzen]
    4. ::-moz-range-track [Übersetzen]
    5. ::-ms-browse
    6. ::-ms-check
    7. ::-ms-clear [Übersetzen]
    8. ::-ms-expand [Übersetzen]
    9. ::-ms-fill
    10. ::-ms-fill-lower
    11. ::-ms-fill-upper
    12. ::-ms-reveal
    13. ::-ms-thumb
    14. ::-ms-ticks-after [Übersetzen]
    15. ::-ms-ticks-before [Übersetzen]
    16. ::-ms-tooltip [Übersetzen]
    17. ::-ms-track [Übersetzen]
    18. ::-ms-value [Übersetzen]
    19. ::-webkit-progress-bar [Übersetzen]
    20. ::-webkit-progress-value [Übersetzen]
    21. ::-webkit-slider-runnable-track [Übersetzen]
    22. ::-webkit-slider-thumb [Übersetzen]
    23. ::after (:after)
    24. ::backdrop
    25. ::before (:before)
    26. ::cue [Übersetzen]
    27. ::first-letter (:first-letter) [Übersetzen]
    28. ::first-line (:first-line) [Übersetzen]
    29. ::grammar-error [Übersetzen]
    30. ::marker [Übersetzen]
    31. ::part() [Übersetzen]
    32. ::placeholder
    33. ::selection
    34. ::slotted() [Übersetzen]
    35. ::spelling-error [Übersetzen]