[CSS] 원형 이미지 마스크 & transform 속성으로 회전시키기 CSS는 HTML5가 되면서, 그리고 IE6이 퇴출되면서 웹 디자인에 새로운 가능성을 열어주고 있습니다. 원형 이미지 마스크 & transform 속성으로 마우스 오버시 회전시키기 다른 말 필요가 없을 듯 합니다. 이 블로그 상단부에도 이러한 속성을 적용시킨 이미지들이 있지만, 모바일에서 오시는 분들을 위해서 한번 밑에다가 보여드리겠습니다. 어때요? 마우스를 올리면 180도 회전합니다. 그리고 원형으로 마스크를 씌워서 실제로는 원형이지 않은(소스 확인해보세요) 이미지를 원형으로 만든 것입니다. 실제 적용 코드는 아래와 같습니다. img.rotate { width: 100px; border-radius: 50em; -webkit-transition: all 0.3s ease-in-out; -moz-tran.. 더보기 이전 1 ··· 136 137 138 139 140 141 142 ··· 229 다음