guricode

See the Pen Untitled by leeys (@agent-megurii) on CodePen. 전에 작성했던 aniomation과 같이 사용하면 좋은 transform입니다. transform은 기본적으로 scale, rotate, translate가 있으며 작성 방식은 transform: scale(숫자); 입니다. scale 은 크기를 결정합니다. ratate는 회전각도를 결정합니다. translate는 X와 Y값을 변경할수 있습니다. translate는 자기 자신을 기준으로 이동하기 때문에 주의하셔야합니다.

css로 태그에 움직임을 주는 방법입니다. 쓰는 방법은 이렇습니다. animation: 이름 동작시간 딜레이 반복여부 그리고 @keyframes로 animation 이름을 호출하여 동작을 줘야합니다. @keyframes 이름 { 0%{ 0일때 작동할 css 명령} 100%{ 100일때 작동할 css 명령} } 예시 See the Pen Untitled by leeys (@agent-megurii) on CodePen.

작업을 하다가 문제가 생겼다 label에 before을 만들고 그 before에 hover 이벤트를 주려고했다. 처음에 before에 직접 hover를 붙여서 써보려고했는데 반응이 없었다. 그 다음에 laber에 호버를 붙이고 before를 바로 붙여보았다. 형태는 laber:hover:before 이렇게 사용했다. 이것도 역시 아무 반응이 없었다. 해결책은 이렇다 laber에 호버를 주고 그 자식요소로 before를 넣어주면 before에 hover이벤트가 작동된다.