skewY 함수
skewY 함수는 Y축을 따라 요소를 비틀어
평행사변형으로 만듭니다.
transform 속성과 함께 사용됩니다.
속성 값은 각도 단위로 지정된 각도입니다.
각도는 양수 또는 음수일 수 있습니다. 양수 값은
위쪽으로 비틀고, 음수 값은 아래쪽으로 비틉니다.
비틀기는 transform-origin 속성으로
지정된 점을 중심으로 수행됩니다.
구문
선택자 {
transform: skewY(각도);
}
예제
이 예제에서 블록은 30도 위쪽으로 비틀어집니다:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewY(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
예제
이 예제에서 블록은 30도 아래쪽으로 비틀어집니다:
<div id="elem">lorem ipsum</div>
#elem {
transform: skewY(-30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
: