svg란?

scalable vector graphics라는 뜻, 확장 가능한 벡터 그래픽

픽셀을 이용하여 그림을 그리는 png, jpg 파일들과는 다르게 벡터를 기반으로 이미지를 표현
그러다 보니 크기를 조절함에 따라 깨지는 것이 없고, 용량이 작기 때문에 웹에서 자주 사용하는 이미지 형식

👍 장점 :

• svg 이미지는 마크업으로 쓰이므로 텍스트 에디터로 작성하고 또 작성된 이미를 수정할 수도 있다.
• 벡터를 기반으로 그려지므로 사이즈를 크게 해도 깨지지 않는다. scalable -> 따라서 어떤 해상도에서 사용하든 동일
• XML 포맷으로 파일이 작성되므로 JS나 CSS로 조작이 가능

👎 단점 :

• 이미자 복잡할 수록 SVG만의 장점은 감소

내부 도형

• rect - 사각형
• polyline - 연결된 직선들의 그룹
• circle - 원
• path - 선과 곡선, 호 등 다양한 형태를 그릴 수 있는 가장 강력한 엘리먼트