오랜만에 CSS

🪄 Timing Function values

{animation-timing-function: value;}
{transition-timing-function: value;}

• linear
  균일한 속도의 선형 전환
• ease
  중간으로 갈수록 속도가 증가하고, 끝에서 다시 느려짐
• ease-in
  천천히 시작하여 끝에서 전환 속도 증가
• ease-in-out
  천천히 전환을 시작하여 속도를 높였다가 다시 느려짐
• ease-out
  빠르게 전환을 시작하고 전환이 계속됨에 따라 속도가 느려짐
• steps(20)
  20개의 정지점에서 전환을 표시, 동일한 시간동안 각 정지점을 표시함
• cubic-bezier(0.19, 1, 0.22, 1)
  큐빅베지어 곡선. 여기서 p1, p3 값은 0과 1 사이에 있어야함

🪄 Semantic / Non-semantic

• 시맨틱 HTML은 웹페이지 콘텐츠의 의미와 구조를 전달하기 위해 HTML 마크업을 사용.
  향상된 접근성, 검색 엔진 최적화 및 웹사이트 유지관리에서의 이점을 제공
• 논시맨틱 HTML은 콘텐츠의 표현과 레이아웃에 더 중점을 둠.
  작성 및 스타일 지정이 더 쉬울수 있지만 접근성이 낮고 콘텐츠나 레이아웃 변경에 적응하기 어려울 수 있음