SVG适合包含元素

Question

这是我的代码：http://jsfiddle.net/t5rhp/4/

我正在努力使SVG扩展并收缩以填补蓝色区域。对于我的生活，我无法理解为什么它没有出现，因为我已经将svg属性设置为100％宽度和高度。

HTML

<svg viewBox="0 0 100 100">
...

CSS

svg {
    width:100%;
    height:100%;
    position:absolute;
    z-index:0;
}

我在这里做错了什么？

Answer 1

如果您为SVG设置了一个设置为0 0 100 100的视图框，请在此区域内绘制元素。

<svg viewBox="0 0 100 100">
...
    <rect x="188" y="832" 

依此类推，你不能指望看到比x='100' y='100'

更进一步的内容

解释：如果您将视窗框重置为0 0 1000 1000，那么 the show goes on