update
Baseline
2023
Neu verfügbar
Seit September 2023 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.
Die update CSS Media-Feature kann verwendet werden, um zu testen, wie häufig (oder ob überhaupt) das Ausgabegerät in der Lage ist, das Erscheinungsbild von Inhalten nach dem Rendern zu ändern.
Syntax
none-
Sobald es gerendert wurde, kann das Layout nicht mehr aktualisiert werden. Beispiel: Dokumente, die auf Papier gedruckt werden.
slow-
Das Layout kann sich gemäß den üblichen Regeln von CSS dynamisch ändern, jedoch ist das Ausgabegerät nicht in der Lage, Änderungen schnell genug zu rendern oder anzuzeigen, damit sie als fließende Animation wahrgenommen werden. Beispiele: E-Book-Reader oder stark leistungsschwache Geräte.
fast-
Das Layout kann sich gemäß den üblichen Regeln von CSS dynamisch ändern, und das Ausgabegerät ist nicht ungewöhnlich in der Geschwindigkeit eingeschränkt, sodass regelmäßig aktualisierende Elemente wie CSS-Animationen verwendet werden können. Beispiel: Computerbildschirme.
Beispiele
HTML
<p>
If this text animates for you, your browser supports `update` and you are
using a fast-updating device.
</p>
CSS
@keyframes jiggle {
from {
transform: translateY(0);
}
to {
transform: translateY(25px);
}
}
@media (update: fast) {
p {
animation: 1s jiggle linear alternate infinite;
}
}
Ergebnis
Spezifikationen
| Spezifikation |
|---|
| Media Queries Level 4 # update |