CSS/Eigenschaften/translate

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die Eigenschaft translate verschiebt die Form eines HTML-Elementes. Sie wurde im CSS Transforms Module Level 2 aus der transform-Eigenschaft herausgelöst.

erlaubte Werte
anwendbar auf alle Elemente (Unterschied Tag Element Attribut)
Browsersupport Details: caniuse.com
Vererbung nein
animierbar ja, als Transformation
Beispiel
:hover .kreis {  
   translate: 100px 50%;
  }
/* entspricht: */
:hover .box {  
   transform: translate(100px, 50%);
  }
Das obere Beispiel verschiebt eine Form mit der neuen CSS-Eigenschaft translate. Sie erfordert ein oder zwei mit Leerzeichen getrennte Werte.
Die Form .box wird mit transform skaliert. Als Wert wird die translate-Funktion mit zwei kommaseparierten Wert innerhalb der Klammer verwendet.
Beachten Sie: Die Syntax für den Wert unterscheidet sich von der der transform-Eigenschaft.

Weblinks

Siehe auch