全屏SVG无缩放

Question

有什么办法可以让SVG 100％100％但禁用缩放吗？

我需要图像在页面中间（水平和垂直）。这里的问题是我想显示SVG画板之外的区域，所以用CSS来集中不适合我。我知道，如果您有100％宽度和设定高度的图像，或者反之亦然，则可以显示这些区域。

这对Flash来说是可能的，但我还没有找到用SVG和HTML来实现的方法。

普通SVG：

<svg style="width: 100px; height: 100px;"> 
    <circle cx="50" cy="50" r="100" stroke="black" stroke-width="3" fill="red" /> 
</svg> 

100％宽

<svg style="width: 100%; height: 100px;"> 
    <circle cx="50" cy="50" r="100" stroke="black" stroke-width="3" fill="red" /> 
</svg> 

现在，当你把相同的代码，并通过100％，使其100％，它缩放图像。有没有办法阻止这个？

100％100％加虚没有大规模码

<svg style="width: 100%; height: 100%;" ##no_scale_code##> 
    <circle cx="50" cy="50" r="100" stroke="black" stroke-width="3" fill="red" /> 
</svg> 

下面是代码的codepen例子，我有这么远： http://codepen.io/cecilomar/pen/Gcpys

Answer 1

你codepen例如SVG包括一个viewBox属性。如果您不想在缩小尺寸时缩放SVG，请删除viewBox。