HTML/CSS

이 글은 Building A Stepper Component 를 참고한 글 입니다. 위 그림처럼 아이템들 사이에 선들이 있는 stepper를 만들것 입니다.위 코드의 결과는 아래의 그림과 같이 나오게 됩니다.그림과 같이 내용들은 가운데 정렬이 되어있고, 각각의 아이템

본 글은 An Interactive Guide to CSS Transitions를 번역한 글 입니다. 오역이 있을 수 있습니다.애니메이션을 만들기 위해 필요한 것은 변하는 CSS 입니다.아래는 hover시에 애니메이션없이 움직이는 버튼을 구현한 예시입니다.!codepe

이글은 An Interactive Guide to Keyframe Animations 를 번역한 글 입니다. 오역이 있을 수 있습니다.이 글에서, CSS keyframe에 관해 깊게 살펴 볼 것 입니다. 동작하는 방식과, 멋있는 애니메이션 효과를 만드는 방법을 알아 보

가장 익숙한 단위입니다. 절대단위이며, 사용중인 디스플레이 크기와 거의 일치합니다.상대단위이며 현재 요소의 폰트크기와 같습니다. 만약 head의 폰트 크기가 24px이고 아래쪽에 2em 크기의 패딩을 주었다면, 아래쪽 패딩 크기는 48px(24px X 2)가 됩니다.r