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，请让sur在此区域内绘制元素。

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

依此类推，你不能期望看到比x='100' y='100'更远的东西。

解释:如果将查看框重置为0 0 1000 1000，则节目还在继续