회전
단위
45도는 deg == 45deg로 사용
turn은 바퀴의 단위 1turn이면 1바퀴를 뜻한다.
양수 일때는 시계방향으로 움직인다. (90deg == 0.25turn)
rotate의 인자 값의 타입은 number이기 때문에 양수 음수 소수점등이 올 수 있다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles/main.css">
<title>CSS</title>
</head>
<body>
<img id="cat" src="cat.jpg">
<div>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Similique nulla deleniti, tempora reprehenderit nobis fugit! Sint architecto praesentium cumque repellat porro, corporis harum, omnis laboriosam fuga, qui dolor id aliquid?</div>
</body>
</html>
#cat{
width:400px;
transform: rotate(45deg);
}
#cat{
width:400px;
transform: rotate(-45deg);
}
양수일때는 시계방향으로 음수일때는 시계반대방향으로 회전