Besuchen Sie unseren Adventskalender 2022!

CSS/Eigenschaften/scale

Aus SELFHTML-Wiki
< CSS‎ | Eigenschaften(Weitergeleitet von Scale)
Wechseln zu: Navigation, Suche

Die Eigenschaft scale skaliert (streckt, staucht oder verzerrt) die Form eines HTML- oder SVG-Elements. Sie wurde im CSS Transforms Module Level 2 aus der transform-Eigenschaft herausgelöst.

Erlaubte Werte
  • ein, zwei oder drei Zahlen oder Prozentangaben
  • Zahlenangabe mit dem Schlüsselwort X Y Z
Vererbung steuernde Werte inherit, initial, unset und revert
Defaultwert

1

anwendbar auf

alle Elemente

Vererbung

nein

animierbar

ja, als Transformation

Beispiel
:hover .kreis {  
   scale: 2 0.5;
  }
/* entspricht: */
:hover .box {  
   transform: scale(2, 0.5);
  }
Das obere Beispiel skaliert eine Form mit der neuen CSS-Eigenschaft scale. Sie erfordert einen, zwei oder drei mit Leerzeichen getrennte Werte.
Die Form .box wird mit transform skaliert. Als Wert wird die scale()-Funktion mit zwei kommaseparierten Wert innerhalb der Klammer verwendet.
Beachten Sie:

Wenn der Y-Wert nicht angegeben wird, ist er standardmäßig der gleiche wie der X-Wert.

Wenn der Z-Wert nicht angegeben wird, ist er standardmäßig 1.

Wenn der dritte Wert weggelassen, 1 oder 100% ist, wird eine 2D-Skalierung angegeben, die der scale()-Funktion entspricht. Andernfalls wird eine 3D-Skalierung angegeben, die der scale3d()-Funktion entspricht.

Siehe auch

Weblinks