SVG 이미지를 100 % 너비 및 높이로 설정

Question

이 svg 이미지에서 너비와 높이를 어떻게 설정할 수 있습니까? 나는 그것을 얻지 않는다.

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
    <path fill="none" stroke="#0074c4" d="M80,80 A80,80 0 1,180.61117636732928,100.45116865416591" stroke-width="3" /> 
</svg> 

viewBox attr을 사용하여 너비와 높이 attr로 시도했습니다. 와 div 주위 svg (나는 어떤 게시물에 svg 이미지가없는 너비와 높이가 자동입니다 .100 %)하지만 아무것도 작동합니다.

는 바이올린 여기 http://jsfiddle.net/k38Bv/1/

Answer 1

당신이 한 실수는 당신이 viewBox 속성을 추가하는 것을 잊었다는 것이다. 스케일링이 중요하기 때문에 필요합니다. 여기 개체가 있어야한다 무엇을 같은 :

HTML :

<svg width="100%" 
    height="100%" 
    viewBox="0 0 300 150" 
    xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
    <path fill="none" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);" stroke="#0074c4" d="M80,80 A80,80 0 1,180.61117636732928,100.45116865416591" stroke-width="3" /> 
</svg> 

바이올린 :

http://jsfiddle.net/k38Bv/2/