Transform and transition of CSS

Transform and transition of CSS

On the mobile side to add the-webkit-prefix, parameters have

Rorate (45deg)//Rotate 45 degrees

Scale (2)//zoom, accept numbers from zero to positive infinity

TranslateX (100px)//displacement transverse

Translatey (100px)//Portrait

skewx/y ()//oblique cut, not commonly used

The first displacement, in the scaling, will be the displacement value is also scaled out, so the property first write that after the write that is influential

Transform and translate do not move out of the document stream and do not change position and size in the document flow

Moving position if you change left and top, you are constantly operating the DOM, the performance is poor, so it is recommended to use transform

Transition occurs when the element style changes, adding a process to the change in the style

Transition-property: The style to animate

Transition-duration: Animation time

Transition-delay: Delay Time

Transition-timeing-function: Animated Form

Transform and transition of CSS