Ich habe mich über SVG-Dateien gewundert. Ich weiß, dass es sich um eine Sammlung von Vektoren handelt, die durch Pfad-Tags in XML definiert sind. Warum hat das SVG-Tag eine Breite und Höhe in Pixel und was ist, wenn wir diese Dimensionen entfernt haben?
Antworten:
Breite und Höhe sind nur relevant, wenn sie viewBoxeingestellt sind. Ohne dieses Attribut können Sie Breite und Höhe sicher löschen. Es wird immer in dem Maßstab angezeigt, in dem es gezeichnet wurde. Wenn a <rect>10px breit 20px hoch eingestellt wurde, wird es in diesem Maßstab 10x20 mit oder ohne Breite oder Höhe angezeigt, wenn keine viewBox eingestellt ist.
Wenn ein viewBoxAttribut festgelegt ist, können Sie die Breite und Höhe verwenden, um die ursprüngliche Skalierung nach oben oder unten anzupassen.
Ohne Breite und Höhe, aber mit eingestelltem viewBox, kann das SVG unendlich skaliert werden, was möglicherweise das gewünschte Verhalten ist oder nicht. In einer reaktionsschnellen HTML-Seite ist dies häufig erwünscht. Es wird vergrößert oder verkleinert, um in den Begrenzungsbehälter zu passen.
Das sind die gleichen
<svg width="240" height="240" xmlns="http://www.w3.org/2000/svg">
<svg xmlns="http://www.w3.org/2000/svg">Dies verdoppelt den ursprünglichen Maßstab.
<svg viewBox="0 0 120 120" width="240" height="240"
xmlns="http://www.w3.org/2000/svg">Dies ermöglicht eine unendliche Skalierung
<svg viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">