IE9 中 CSS 高度为 100% 的画布

Posted 2023-03-05

【中文标题】IE9 中 CSS 高度为 100% 的画布

【英文标题】：canvas with css height 100% in IE9

【发布时间】：2011-07-28 15:22:31

【问题描述】：

我在 CSS 中有一个宽度：100% 和高度：100% 的画布，并且没有设置任何属性。我知道由属性设置的画布的视口大小与使用 css 定期设置的元素大小之间的区别。 IE9 对 width:100% css 的响应很好，但完全忽略了高度。这是一个错误吗？怎么了？ 它在 FF 和 Chrome 中运行良好...

【参考方案1】：

body 
    width: 100%; height: 100%;
    margin: 0; padding: 0;


canvas 
   width: 100%; height: 100%;

这应该可以解决问题。

【讨论】：

它可能适用于正文下方的画布，但我的 html 有点复杂。画布位于 div 中。我希望画布采用 div 的大小。包含 div 高度的 Th 已设置并且“行为”正常。

@Sonia 然后在包含的 div 上设置 position:relative，使其成为其子级的定位父级。 （在未来，请发布实际代码——最好是简化的、精简的测试用例——以便回答你问题的人可以完全这样做。）

（小注）当CSS中的长度值为0时，单位是什么无关紧要；以上可以更简单地改写为margin:0; padding:0。