css - 如何使传单 map 高度可变

Question

在我的应用程序中，我将 map 的 div 设置为

<div id="map" style="height: 610px; width:100%"></div>

但是为了使我的 map 具有响应性，我想将高度也设置为 100%，如果我将 height: 100% 设置为 100%，则它不起作用。

如何使高度也像宽度一样可变，以便在任何设备上都能正确看到 map 。

演示:http://jsfiddle.net/CcYp6/

如果您更改 map 的高度和宽度，那么您将不会获得 map 。

Answer 1

您需要先将父元素设置为height: 100%;

html, body {
   height: 100%;
}

Demo

Demo (这不会起作用，因为没有定义父高度)

解释:你为什么需要这样做？因此，当您在 % 中指定元素的高度时，出现的第一个问题是:100% 是什么？ 默认情况下，div 的高度为 0px，因此 100% 对 div 根本不起作用，但将父元素 height 设置为100%; 会起作用。