svg가 그려지는 효과(with. stroke dasharray, stroke-dashoffset)
1. 미리보기 stroke-dasharray, stroke-dashoffset을 사용해 svg가 그려지는 효과를 만들어보자! See the Pen 시계 by KumJungMin (@kumjungmin) on CodePen. 2. 코드 설명 1) 어떻게 하면 그림이 생겼다가 사라질까? 우리는 먼저 svg 이미지를 준비해야한다. 그리고 svg 이미지에 dasharray, dashoffset을 사용하면 그려지는 효과를 줄 수 있다. 2) stroke-dasharray, svg에 간격 주기 stroke-dasharray는 선을 대쉬 형태로 만든다. (값을 부여한 만큼 대쉬길이가 늘어남) svg태그에는 path가 있다. (svg의 path에 대해 대해 더 알아보기) 만약 path의 길이가 100이고, dashar..
2021. 9. 29.
