Heim >Web-Frontend >CSS-Tutorial >So verwenden Sie das CSS-Transform-Origin-Attribut
Definition und Verwendung
Mit dem transform-origin-Attribut können Sie die Position des transformierten Elements ändern.
2D-Transformationselemente können die x- und y-Achse des Elements ändern. 3D-Transformationselemente können auch ihre Z-Achse ändern.
Hinweis: Dieses Attribut muss zusammen mit dem Transformationsattribut verwendet werden.
Instanz
Legen Sie die Basispunktposition des gedrehten Elements fest:
div { transform: rotate(45deg); transform-origin:20% 40%; -ms-transform: rotate(45deg); /* IE 9 */ -ms-transform-origin:20% 40%; /* IE 9 */ -webkit-transform: rotate(45deg); /* Safari 和 Chrome */ -webkit-transform-origin:20% 40%; /* Safari 和 Chrome */ -moz-transform: rotate(45deg); /* Firefox */ -moz-transform-origin:20% 40%; /* Firefox */ -o-transform: rotate(45deg); /* Opera */ -o-transform-origin:20% 40%; /* Opera */ }
Syntax
transform-origin: x-axis y-axis z-axis;
Das obige ist der detaillierte Inhalt vonSo verwenden Sie das CSS-Transform-Origin-Attribut. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!