탐구하는 취르미

자주 사용하는 속성은 막힘없이 써 내려가지만 헷갈리는 속성들이 있어서, 내용을 정리하는 차원에서 포스팅 시작하겠습니다. 1. animation-name : 애니메이션 이름 @keyframes에 애니메이션을 정의할 이름 2. animation-duration : 애니메이션 재생시간 초기값(default): 0s * 초(s), 밀리초(ms) 단위로 설정할 수 있습니다. 3. animation-timing-function : 애니메이션 진행 스타일 초기값(default): ease ease, ease-in, ease-out, ease-in-out, linear, step-start, step-end, steps, cubic-beszier 4. animation-delay : 애니메이션 지연시간 초기값(defa..

반응형(responsive) 페이지 작업할 때, css에서 미디어 쿼리(media query) 분기점(breakpoint) 작성 순서입니다 분기점은 해당 프로젝트에 맞게 설정하시면 됩니다 Mobile First 작은 너비 순으로 시작 @media screen and (min-width: 768px) { /* 768px 이상 */ } @media screen and (min-width: 1024px) { /* 1024px 이상 */ } Desktop First 넓은 너비 순으로 시작 @media screen and (max-width: 1023px) { /* 1023px 이하 */ } @media screen and (max-width: 767px) { /* 767px 이하 */ }