css - DIV 高度和宽度

Question

我想要一个宽度填充视口(viewport) 100% 且高度为同一 div 宽度的 10% 的 div。我一直在尝试 height: 10vw; 但是它并不适用于所有浏览器(尤其是 firefox 和 Android)。我有什么遗漏的吗？实现它的最佳方法应该是什么？

谢谢!

更新:它是同一个 div。想要一个宽度为 100% 高度为 10% 的单个 DIV。

Answer 1

它不适用于所有浏览器，因为它们尚未实现。在 Android 中它还不能工作，在 Firefox 中它应该在版本 19 及更高版本上工作:http://caniuse.com/viewport-units

您可以将您的元素置于绝对位置，并为其指定 100% 的高度。它将覆盖第一个位置不同于静态的元素的 100% 高度，如果没有任何元素，那么它将覆盖根的高度。 根是视口(viewport)。

div {
  position: absolute;
  height: 100%;
}

还有一个 polyfill支持 vw/vh/vm 单位。