SVG-高度和宽度百分比在HTML5中不起作用

我有一个宽度和高度设置为100%的SVG，属性“PreserveSpectratio”设置为“xMidYMid meet”

使用google chrome，在添加标签（使其成为HTML5）后，行为会发生变化。SVG元素不会占用页面上的所有空间，SVG的高度会自动按宽度的比例设置

没有DOCTYPE的HTML-按预期工作

身体{
填充：0；
保证金：0；
}

如果设置html和body元素的宽度和高度，则无论是否存在html DOCTYPE，都可以得到任何结果

  body, html {
    padding:0;
    margin:0;
    height: auto;
    width: 100%;
  }

或

传统渲染只是对默认html高度属性有不同的默认值。这两种情况都是“有效”的，只要你明白这一点，这只是你想要的一种情况

您可能还希望使svg元素显示为：block，例如

  svg {
    display: block;
  }

---

将100%宽度和高度添加到html解决了SVG高度的问题，但现在页面有垂直滚动和html标记获得自己的高度，请检查-这仅在SVG的情况下发生，而不使用其他标记，如DIVmake

元素display:block<默认情况下，代码>是块。

  svg {
    display: block;
  }