color-gamut CSS Media Feature
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Februar 2023 browserübergreifend verfügbar.
Die color-gamut CSS Medienfunktion wird verwendet, um CSS-Stile basierend auf dem ungefähren Bereich der von der Benutzeragentur und dem Ausgabegerät unterstützten Farb-Gamut anzuwenden.
Syntax
Die color-gamut-Funktion wird als einer der folgenden Farbräume als Schlüsselwort-Werte angegeben:
srgb-
Die Benutzeragentur und das Ausgabegerät können ungefähr den sRGB Gamut oder mehr unterstützen. Dies schließt die überwiegende Mehrheit der Farbdisplays ein.
p3-
Die Benutzeragentur und das Ausgabegerät können ungefähr den vom Display P3 Farbraum spezifizierten Gamut oder mehr unterstützen. Der P3 Gamut ist größer und enthält den sRGB Gamut.
rec2020-
Die Benutzeragentur und das Ausgabegerät können ungefähr den vom ITU-R Empfehlung BT.2020 Farbraum spezifizierten Gamut oder mehr unterstützen. Der REC. 2020 Gamut ist größer und enthält den P3 Gamut.
Beispiele
HTML
<p>This is a test.</p>
CSS
p {
padding: 10px;
border: solid;
}
@media (color-gamut: srgb) {
p {
background: #f4ae8a;
}
}
Ergebnis
Spezifikationen
| Spezifikation |
|---|
| Media Queries Level 4 # color-gamut |
Browser-Kompatibilität
Siehe auch
color()Funktion, um Farben in einem definierten Farbraum anzugeben.- CSS Farben Modul
@mediaAt-Regel, die verwendet wird, um dencolor-gamut-Ausdruck anzugeben.- Verwendung von Media Queries, um zu verstehen, wann und wie man eine Media Query verwendet.
- CSS Media Queries Modul
- sRGB auf Wikipedia