답변:
너비와 높이는 viewBox
설정된 경우에만 관련 이 있습니다. 이 속성이 없으면 너비와 높이를 안전하게 삭제할 수 있습니다. 항상 그려진 눈금으로 표시됩니다. <rect>
너비가 10px (높이) 20px (높이)로 설정되어 있으면 viewBox가 설정되어 있지 않을 때 너비 또는 높이가 있거나없는 10x20 크기로 표시됩니다.
경우 viewBox
속성이 설정되어있는 경우 위 또는 아래로 원래의 스케일을 조정 폭과 높이를 사용할 수 있습니다.
너비와 높이는 없지만 viewBox를 설정하지 않으면 svg를 무한대로 확장 할 수 있으며, 이는 원하는 동작 일 수도 있고 아닐 수도 있습니다. 반응 형 HTML 페이지에서 이것은 종종 바람직합니다. 경계 컨테이너에 맞게 확장 또는 축소됩니다.
이것들은 같습니다
<svg width="240" height="240" xmlns="http://www.w3.org/2000/svg">
<svg xmlns="http://www.w3.org/2000/svg">
원래 배율이 두 배가됩니다.
<svg viewBox="0 0 120 120" width="240" height="240"
xmlns="http://www.w3.org/2000/svg">
이것은 무한한 스케일링을 허용합니다
<svg viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">