CSS3---2D transformation

transform

　Transition-origin: Set the origin referenced by the transformation in the object

none: No transformation

　translate([,]): Specifies the 2D translation of the object (2D translation). The first parameter corresponds to the X-axis, and the second parameter corresponds to the Y-axis. If the second parameter is not provided, it defaults to 0.

　　translateX(): Specify the X-axis translation of the object

　　translateY(): Specify the Y-axis translation of the object

　rotate(): Specifies the 2D rotation of the object (2D rotation), which requires the definition of the existing transition-origin attribute

　Scale([,]): Specifies the 2D scale (2D scaling) of the object. The first parameter corresponds to the X-axis, and the second parameter corresponds to the Y-axis. If the second parameter is not provided, the first parameter is taken by default.

　 ScaleX(): Specifies the (horizontal) scaling of the X-axis of the object

　 scaleY(): Specifies the (vertical) scaling of the Y-axis of the object

　skew(): Specifies the skew transformation of the object (oblique distortion). The first parameter corresponds to the X-axis, and the second parameter corresponds to the Y-axis. If the second parameter is not provided, it defaults to 0.

　　skewX(): Specifies the (horizontal) distortion of the Y-axis of the object

　　skewY(): Specifies the (horizontal) distortion of the Y-axis of the object

Transition:

transtion:[transtion-property]||[transtion-duration]||[transtion-timing-function]||[transtion-delay]

　transtion-property: Retrieve or set the properties involved in the transition in the object default

　transtion-duration: Retrieve or set the duration of object transition

　Transtion-timing-function: Retrieve or set the animation type of object transition

　Transtion-delay: Retrieve or set the time of object delay transition

Animation:

animation:[animation-name]||[animation-duration]||[animation-timing-function]||[animation-delay]||[animation-iteration-count]||[animation-direction]

　animation-name: Retrieve or set the animation name applied to the object

　animation-duration: Retrieve or set the duration of object animation

　animation-timing-function: Retrieve or set the transition type of object animation

　animation-delay: Retrieve or set the delay time of object animation

　animation-iteration-count: Retrieve or set the number of cycles of object animation

　animation-direction: Retrieve or set whether the object animation moves in reverse in the loop