[CSS] transform 한번에 여러개(scale, skew, translate) 적용하는 matrix()
scale 크기변화 skew기울기 translate이동 matrix(scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY()); 순서로 이루어진다. .box:hover:after{ transform: matrix(1.3, 0.1, 0.3, 2, -100, 150); } 위의 코드에 따라 적용되었으므로 가로로 1.3배 커지고, y축으로 10도 기울어지고, x축으로 30도 기울어지고 x축으로 -100px y축으로 150px 이동 See the Pen wLweNQ by gahyun (@gahyun) on CodePen. 각각 하나씩 나누어보면 아래와 같다 .box1:after{transform: scaleX(1.3);} .box2:after{trans..
2019. 6. 10.