CSS3---2D transform, css3 Transform

CSS3---2D transform, css3 Transform

Transform

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

None

Translate (<length> [, <length>]): Specifies the 2D translation (2D translation) of an 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 default value is 0.

TranslateX (<length>): Specifies the x-axis translation of the object.

TranslateY (<length>): Specifies the object's Y-axis translation.

Rotate (<angle>): Specifies the 2D rotation (2D rotation) of the object, which requires the definition of the existing transtion-origin attribute.

Scale (<number> [, <number>]): Specify the 2D scale of an object (2D scale ). 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 used by default.

ScaleX (<number>): Specifies the (horizontal) scaling of the X axis of the object.

ScaleY (<number>): Specifies the (vertical) scaling of the object's Y axis.

Skew (<number>): Specifies the skew transformation (oblique distortion) 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 default value is 0.

SkewX (<number>): Specifies the (horizontal) distortion of the Y axis of the object.

SkewY (<number>): Specifies the (horizontal) distortion of the Y axis of the object.

 

Transition:

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

Transtion-property: Retrieves or sets the default attribute of the object involved in the transition.

Transtion-duration: Retrieves or sets the object transition duration.

Transtion-timing-function: Retrieves or sets the animation type for object transition.

Transtion-delay: Retrieves or sets the object delay transition time.

 

Animation:

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

Animation-name: Retrieves or sets the animation name applied to an object.

Animation-duration: Retrieves or sets the duration of an object animation.

Animation-timing-function: Retrieves or sets the transition type of an object animation.

Animation-delay: Retrieves or sets the delay time of an object animation.

Animation-iteration-count: Retrieves or sets the number of cycles of an object animation.

Animation-direction: Retrieves or sets the reverse motion of an object animation in a loop.