css3 transform attribute value is primarily affected are the following, Rotate rotation, skew distortion, scaling Scale, and move Translate . And when the complex wording translate the position different from that ultimately results will also be affected, what the impact principle is it? Ado,
Figure ↓ ↓ ↓
black block to the right, respectively 400px, 200px
red block FIG: transforms：scale（2）translateX（200px）if the red block :transforms：translateX（200px）scale（2）
In general wording to perform complex operations transform the latter, as
transform: translateX() scale();the execution order to re-scale displacement. But when the shift operation will be located behind a front impact operation:
When the code is transforms：scale（2）translateX（200px）displacement amplification instruction instruction Affected displacement distance will become enlarged twice 400px , and then perform the zoom operation. That distance will be affected by the displacement of the zoom operation is changed, a factor equal to the displacement distance change zoom factor
when code translate（200px）scale（2）when it performs normal, enlarged twice right 200px. 
Black blocks are respectively right 200px, 200px
red block FIG: transforms： rotate(45deg) translateX（200px）if the red block : transforms：translateX（200px） rotate(45deg）
we can easily be seen from FIG effect, when translate（）positioned rotate（）upon the back, which is affected by the direction of displacement of the rotational operation, the direction of 45 ° degrees offset .
That is , when the rotational operation in front of the shift operation, the displacement direction will be affected, the same angle with the rotating angle of the direction of change.
Well, today's share to this end, let us make progress together now! ! ! !
