Skalierung
scale() ermöglicht es uns, die Größe eines Elements zu vergrößern oder zu verkleinern. Außerdem können wir ein Element nur vertikal mit der scaleY()-Eigenschaft oder nur horizontal mit der scaleX()-Eigenschaft skalieren.
transform: scale(X-value, Y-value);
transform: scaleX(value);
transform: scaleY(value);
Die Werte für die scale-Funktionen müssen einheitslos sein. Standardmäßig ist der Wert 1, was bedeutet, dass keine Änderungen vorgenommen werden.
- Die
scale()-Funktion kann zwei Werte erhalten. Der erste (X-value) ist die Zahl, die die horizontale Skalierung darstellt. Der zweite (Y-value) ist die Zahl, die die vertikale Skalierung darstellt. Wenn wir einen Wert festlegen, wendet der Browser denselben Wert für horizontale und vertikale Skalierungen an; - Die
scaleX- undscaleY-Funktionen erhalten einen Wert und ändern ein Element horizontal bzw. vertikal.
Lassen Sie uns etwas üben und Skalierungen für die folgenden Elemente hinzufügen:
index.html
index.css
War alles klar?
Danke für Ihr Feedback!
Abschnitt 5. Kapitel 2