CSS3 2D Conversion

One, CSS3 2D has two properties:

(1), transform: The element used for 2D or 3D conversion.

(2), Transform-origin: Allows changing the location of the conversion element .

Two, CSS3 2D of the transform attribute There are 5 major methods:

1, rotate (angle) Rotation method: Define 2D rotation, the parameters of the method specifies the angle (deg).

Html:

Css:

Effect:

2, scale () Scaling method: Define 2D scaling elements.

(1), scale (x, y): Defines 2D scaling, changing the width and height of the element.

Html:

Css:

Effect: twice times larger than the original

(2), ScaleY (n): 2D zoom, change the height of the element.

Html:

Css:

Effect:

(3), ScaleX (n) 2D zoom, change the width of the element.

Html:

Css:

　　　　　　　　　　　　　　　　　　　　　　

　　　　　

Effect:

　　　　

CSS3 2D Conversion