Existe-t-il un concept de taille dans un SVG?

Je me posais des questions sur les fichiers SVG. Je sais que c'est une collection de vecteurs définis par des balises de chemin en XML, alors pourquoi a-t-il une largeur et une hauteur en pixels dans la balise svg et que se passe-t-il si nous supprimons ces dimensions?

La largeur et la hauteur ne sont pertinentes que lorsque viewBoxest défini. Sans cet attribut, vous pouvez supprimer en toute sécurité la largeur et la hauteur. Il s'affichera toujours à l'échelle à laquelle il a été dessiné. Si un a <rect>été défini sur 10px de large et 20px de haut, il s'affichera à cette échelle 10x20 avec ou sans largeur ou hauteur lorsqu'aucune viewBox n'est définie.

Si un viewBoxattribut est défini, vous pouvez utiliser la largeur et la hauteur pour ajuster l'échelle d'origine vers le haut ou vers le bas.

Sans largeur ni hauteur, mais viewBox défini, cela permettra au svg de s'ajuster à l'infini, ce qui peut ou non être le comportement souhaité. Dans une page HTML réactive, cela est souvent souhaité. Il augmentera ou diminuera pour s'adapter au conteneur englobant.

Ce sont les mêmes

<svg width="240" height="240" xmlns="http://www.w3.org/2000/svg">
<svg xmlns="http://www.w3.org/2000/svg">

Cela double l'échelle d'origine.

<svg viewBox="0 0 120 120" width="240" height="240" 
xmlns="http://www.w3.org/2000/svg">

Cela permet une mise à l'échelle infinie

<svg viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">