![]()
📑 개요 웹에 있어 애니메이션은 UX를 향상시키고 사용자의 흥미를 끄는 데 굉장히 큰 역할을 한다! 나도 프로젝트를 할 때 애니메이션에 꽤나 신경을 써서 작성하는 편이다. 이런 애니메이션에는 크게 CSS 애니메이션과 JavaScript 애니메이션이 있으며 분명한 차이점도 갖고 있다. 지금부터 그 차이점과 장단점을 알아보자! 🎀 CSS 애니메이션과 예시 - CSS 애니메이션이란? 웹페이지의 스타일을 선언적으로 정의하는 데 사용된다. 간단하게 처리할 경우 CSS 애니메이션을 사용한다. transition이나 hover, @keyframes, animation 등의 속성이 있다. - transition과 hover 예시 // transition 속성을 사용하여 박스의 크기를 변경하고 // :hover 선택자를..
📑 개요 attribute와 property.. 많이 헷갈릴 개념이다. 가장 중요한 건 무엇이 변하고 무엇이 변하지 않는가라고 생각되고... 이걸 이해하면 대략적으로는 다 이해했다고 생각된다. 약간 어렵긴 한데...! 시작한다. 🧿 Attribute와 Property의 정의와 사용 - HTML의 Attribute HTML 요소의 속성 HTML 마크업에 정의되어 있는것 default 값이 변하지 않음 html 문서에서 시각적이거나 기능적인 효과를 나타낼 때 사용됨 정적인 값으로 html 문서가 로드될 때 초기화 // input -> element // type, value -> attribute // "text", "0" -> value - DOM의 Property JavaScript 객체의 속성 HTML..
