CSS/Funktionen/scale3d()
Aus SELFHTML-Wiki
< CSS | Funktionen(Weitergeleitet von Scale3d())
Die scale3d()-Funktion definiert eine Transformation, die die Größe eines Elements im 3D-Raum ändert. Da das Ausmaß der Skalierung durch einen Vektor definiert wird, kann die Größe verschiedener Dimensionen in verschiedenen Maßstäben geändert werden Ihr Ergebnis ist ein Datentyp <Transformationsfunktion>.
Parameter |
|
---|---|
anwendbar auf | * HTML-Blockelemente, mit Ausnahme von nicht ersetzten Inline-Elementen |
Browsersupport | caniuse: mdn-css_types_transform-function_scale3d |
Beispiel
@keyframes skalierung {
0% { transform: scale3d(1, 1, 1); }
17% { transform: scale3d(1, 2, 1); }
33% { transform: scale3d(1, 2, 2); }
50% { transform: scale3d(2, 2, 2); }
67% { transform: scale3d(2, 2, 1); }
83% { transform: scale3d(2, 1, 1); }
100% { transform: scale3d(1, 1, 1); }
}
.cube {
animation: skalierung 5s infinite linear;
}
Dieses Beispiel zeigt, wie ein Würfel nacheinander zu einem Quader gestreckt und anschließend wieder gestaucht wird.