프론트엔드
SVG를 이용하여 Animation 만들기_후속
두줄요약
SVG의 `viewBox`, `viewport`, `preserveAspectRatio` 개념을 정리하고 `meet`와 `slice`의 동작 차이를 설명했습니다.\n크기 관계에 따라 정렬 기준이 어떻게 달라지는지 예시로 살펴보았습니다.
핵심 내용
- SVG의
viewBox와viewport개념 정리 preserveAspectRatio속성의 역할과meet,slice동작 비교- viewport와 viewBox의 크기 관계에 따른 정렬 기준 변화
xMinYMin,xMidYMid,xMaxYMax조합별 위치 차이 설명
적용해볼 점
- SVG 아이콘과 애니메이션에서 비율 유지 방식 점검
meet와slice조합으로 화면 크기별 배치 의도 반영