transform : translate(00, 00), rotate(00deg), scale(00)

지정한 요소의 크기, 위치, 각도회전

transition: 00s

transform이 작용하는 시간

	<style>
        .box {width: 200px; height: 200px;}
        /* 크기, 위치, 회전 */
        .box1 {background-image: url('https://t1.daumcdn.net/cfile/tistory/9937AC3C5C2757FE22');background-size: cover; transition: 1s; background-color: rgb(255, 255, 0);}
        .box1:hover{background-image: url('https://t1.daumcdn.net/cfile/tistory/9937AC3C5C2757FE22');background-size: cover; background-color: aqua; transform:translate(2000px) scale(0.5) rotate(300000deg);}

        .box2 {background-color: crimson; transform: translate(100px, 100px);}
        .box3 {background-color: yellowgreen; transform: rotate(10deg);} /* deg : degree 도*/
    </style>

	<div class="box box1"></div>
    <div class="box box2"><h1>박스2</h1></div>
    <div class="box box3"><h1>박스3</h1></div>