javascript - 如何让传单 map Canvas 具有 100% 的高度?

标签 javascript html css leaflet

我的传单 Canvas 目前如下所示,高度为 700 像素:

Map with 700px height

但是我希望它的高度为 100%,以便占据整个空白区域。

height:100% 在 map Canvas 的 CSS 属性中不起作用。 我找到了一些解决方案,但它们只适用于谷歌地图。

有没有人有解决方案,即使它只是一个解决方法? 谢谢!

最佳答案

最好的方法是使用 CSS 长度单位 vhvw。这些允许 block 级 HTML 元素具有相对于 视口(viewport) 大小的尺寸,而不是其父元素 的尺寸(如 %确实)。

例如:

#map {
  width: 100vw;
  height: 100vh;
}

供引用:https://developer.mozilla.org/en-US/docs/Web/CSS/length

关于javascript - 如何让传单 map Canvas 具有 100% 的高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37588601/

相关文章:

javascript - 需要 Jquery 动画/功能帮助

html - 显示数据后 Ajax 加载图像

javascript - 有什么方法可以将整个网页从不同域加载到我的页面吗?

css - CSS 可以选择特定内容的元素吗?

javascript - Typescript文件编译完成后为什么要执行ESlint?

javascript - 使用 JavaScript 和 jQuery 创建便签

php - 如何创建 Left Tabber 内容

css - 如何让下拉菜单显示在前面

javascript - 使用 JavaScript 和 Bootstrap 的动态 Masonry Gallery

javascript - 合并两个要共同引用的 HTML 元素对象