如何調整SVG大小？

我有這樣的代碼：如何調整SVG大小？

<span> 
    <svg height="32" version="1.1" width="32" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.0166626px; top: -0.983337px;"> 
     <desc></desc> 
     <defs/> 
     <path style="" fill="#333333" stroke="none" d="M15.985,5.972C8.422,5.972,2.289999999999999,10.049,2.289999999999999,15.078C2.289999999999999,17.955,4.302999999999999...............1,27.68,22.274Z"/> 
     </svg>&nbsp; 
    </span>

我切出大部分的內容，並與...

取代它這目前創建了一個32×32的圖標。我想知道的是，我可以使用此代碼創建100乘100圖標嗎？我試着改變寬度和高度，但沒有什麼區別。

來源

2012-03-01 Samantha J T Star

SVG元素上的width和height屬性僅定義了繪圖區域的大小。他們不會縮放內容以適應該區域。對於這一點，你需要同時使用viewBox屬性，就像這樣：

<svg viewBox="0 0 32 32" height="100" width="100" ...>

viewBox屬性規定，用於SVG的所有子元素的座標系。然後，您可以使用寬度和高度將此座標系拉伸至所需的尺寸。

如果縱橫比不匹配，您可以使用preserveAspectRatio屬性決定如何縮放。

來源

2012-03-01 18:40:39 mercator

當svg寬度大於視點的寬度時，這似乎不起作用。我用 widged 2014-01-14 01:34:28

@widged，'style'和'width'之間不應該有任何區別和「高度」。因此，我可以在SVG和我之間看到的唯一區別是，您想要將大型SVG縮小爲圖標大小，而問題是關於縮放圖標大小的SVG。該方法仍然相同。 – mercator 2014-01-14 12:55:04

昨天我有一些奇怪的行爲，我今天無法複製。可能包含一些錯字。 http://bl.ocks.org/widged/8428059上的簡單演示顯示縮小尺寸確實與尺寸屬性或樣式相同。 – widged 2014-01-14 23:55:02

如何調整SVG大小？

回答

相關問題