LESS에서 벤더 프리픽스를 사용한 변환(Transform)
rotate
및
skew
함수를 통해 크로스 브라우저 변환을 설정하는 함수를 만들어 봅시다:
.rotate(@r) {
-moz-transform+_: rotate(@r);
-webkit-transform+_: rotate(@r);
transform+_: rotate(@r);
}
.skew(@s) {
-moz-transform+_: skew(@s);
-webkit-transform+_: skew(@s);
transform+_: skew(@s);
}
우리가 만든 함수를 사용해 봅시다:
div {
.rotate(10deg);
.skew(10deg);
}
컴파일 결과:
div {
-moz-transform: rotate(10deg) skew(10deg);
-webkit-transform: rotate(10deg) skew(10deg);
transform: rotate(10deg) skew(10deg);
}
