如何让传单地图画布具有 100% 的高度?

2024-04-19

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

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

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

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


最好的方法是使用 CSS 长度单位vh and vw。这些允许块级 HTML 元素具有相对于viewport大小,而不是其大小父元素 (as % does).

e.g.:

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

以供参考:https://developer.mozilla.org/en-US/docs/Web/CSS/length https://developer.mozilla.org/en-US/docs/Web/CSS/length

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何让传单地图画布具有 100% 的高度? 的相关文章

  • 如何在D3中导入json数据?

    如何在D3中导入json文件 I did d3 json temp json 但是我如何在进一步的代码中访问这个数据集呢 到目前为止我已经尝试过 var data d3 json temp json 但使用 data data 在其余代码中
  • JS 是否支持使用键函数而不是比较器进行排序?

    JavaScript 的array sort https developer mozilla org en US docs Web JavaScript Reference Global Objects Array sort Syntax方
  • Chrome DevTools 脚本黑盒不起作用

    我正在尝试使用 chrome devtools 的新功能 黑盒脚本 这篇 Chrome Devtools 文章列出了脚本黑盒功能 https developer chrome com devtools docs blackboxing wh
  • jQuery:在方法上取消绑定 jQuery 2.0

    在 jQuery 1 9 中live 已被弃用 因此新方法变为 document on mouseover blahblahfunc 我无法解除 blahblahfunc 的绑定 通过 unbind mouseover mouseout c
  • Javascript 闭包问题

    所以 我仍在阅读 Apress Pro Javascript 技术 但我在闭包方面遇到了麻烦 正如约翰 雷西格所说 闭包允许您引用父函数中存在的变量 然而 它在创建变量时并不提供变量的值 它提供父函数中变量的最后一个值 这是最常见的问题 您
  • RxJS 将三元组中的属性组合到表中

    我有一项服务生成类似于三元组的对象 它们将采用以下格式 country attribute value Example country usa attribute population value 100 country mexico at
  • JS 检查深层对象属性是否存在[重复]

    这个问题在这里已经有答案了 我正在尝试找到一种优雅的方法来检查对象中是否存在某些深层属性 因此 实际上试图避免对未定义的情况进行巨大的保护性检查 例如 if typeof error undefined typeof error respo
  • -moz-background-clip:text 在 Firefox 中不起作用

    我正在尝试用图像填充 h1 标签中的文本内容 根据我的理解 我在 html 中执行以下操作 div class image clip h1 MY WONDERFULL TEXT h1 div 并在 css 文件中 image clip ba
  • JavaScript 中 == 和 === 的区别[重复]

    这个问题在这里已经有答案了 有什么区别 and 在 JavaScript 中 我也见过 and 运营商 还有更多这样的运营商吗 看看这里 http longgoldenears blogspot com 2007 09 triple equ
  • 设备收到 GCM Android 通知但未显示

    尽管通知已在应用程序本身中注册 但我的 Ionic Android 应用程序的 GCM Cloud 消息通知未出现在我的设备的主屏幕中 我正在使用 npm 模块node gcm https www npmjs com package nod
  • 如何仅使用 Javascript 减慢平滑滚动的默认速度?

    我的目标是按回车键 然后让网站滚动到底部 我已将滚动行为设置为平滑 一切都正常工作 除了平滑滚动的默认速度太快了 我怎样才能减慢它的速度 下面是我的代码 请不要使用jquery 谢谢你 document body onkeyup funct
  • 浮动的垂直对齐方式:左div的

    我有大约 10 个宽度相等但高度不同的 div 我希望它们尽可能紧密地组合在一起 当设置为向左浮动时 它们不会垂直彼此对齐 而是与上面 行 的底部对齐 我在下面模拟了一个小例子 想要去掉空白 你有什么建议吗 我仅限于使用这种格式 因为内容是
  • Bootstrap 4.1.1 form-check form-check-inline 单选按钮

    我正在尝试将单选按钮显示为内联选项 在 Bootstrap 4 1 1 文档中 示例代码是 div class form check form check inline div
  • 脚本和链接标签的简写 http:// 为 // ?有人以前看过/用过这个吗?

    问题如下 如果您使用 addthis 共享按钮 查看任何网站 一旦您浮动在 addthis 按钮上 并且加载了所有必需的资源 请使用 firebug 或 chrome 检查器查看文档的正文 不是源代码 而是屏幕上的实际文档 对象检查器 你会
  • leaflet + gMapCatcher-更改zxy模板

    我在用着leaflet由 gMapCatcher 生成的图块 那里的文件名完全不同 例如 传单中的缩放级别 17 是 gMapCatcher 的级别 0 我需要更改 url 模板 http s somedomain com blabla z
  • 在客户端将大文件(> 2GB)压缩为 ZIP

    我使用构建上传工具node js and socket io 因为他们通常会上传令人难以置信的巨大文件 而普通的上传表单将无法工作 问题是他们想在发送之前将文件压缩成zip 以提高传输效率 我一直在研究压缩方法 例如JSZip http s
  • Dojo 是否可以与其他 JS 框架结合?

    我们使用 Dojo 1 9 3 作为构建单页面应用程序的 JS 框架 然而 我们在 Dojo 的怪癖上花费了太多时间 因此即使是简单的任务也需要很长时间才能实现 由于缺乏适当的文档 我们经常不得不求助于阅读源代码 然后实施解决方法 我觉得如
  • 我的引导页面页脚下方的空白

    虽然我之前在身体下方确定了 50 像素的填充 但我仍然遇到页面页脚下方有一堆空白的问题 我是否只需要延长内容即可填充垂直空间 我第一次使用 bootstrap 来创建我的新网站 但我陷入了这个恼人的困境 这是一个有问题的页面的链接 http
  • JavaScript 有内置的 stringbuilder 类吗?

    I see a few 代码项目解决方案 http www codeproject com KB scripting stringbuilder aspx 但是JavaScript中有常规的实现吗 如果您必须为 Internet Explo
  • @media查询和图像交换[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我希望在调整浏览器大小时网站中的图像完全改变 我一直在使用媒体查询 但我似乎无法正确使用它 有什么想法 建议吗 将来请添加您尝试过的代

随机推荐

  • PHP:PDF 生成

    我目前正在一个网站上工作 基本上 当用户搜索某些内容时 我应该能够为每个搜索结果项生成 pdf 我知道 fpdf 的一种选择 有没有比 fpdf 更简单的东西或某些服务 例如如果我发送搜索结果页面的 url 它会将生成的 pdf 发送回给我
  • Lua:冒号符号、“自我”和函数定义与调用

    我对定义 调用 Lua 函数时使用的冒号表示法感到非常困惑 我以为我已经明白了 直到我看到这段代码 function string PatternSafe str return str gsub pattern escape replace
  • 如何“全局”“重载”python的打印函数?

    我使用的是 python 2 6 6 我需要重载默认的 python 打印函数 我需要这样做 因为此代码可能在必须使用内置函数来生成输出的系统上使用 否则不会显示任何输出 举例来说 如果你有一个像这样的 python 脚本 from fut
  • 是否可以像在 CodeIgniter 中一样获取 ExpressionEngine 中的所有后期变量?

    在 CI 的控制器中 您可以通过执行以下操作来获取所有后置变量 data this gt input gt post 在 EE 由同一个人基于 CI 构建 中 类似的语法是 data this gt EE gt input gt post
  • 将 UITableView 分隔符隐藏在 contentView 后面

    我在 iPhone OS 3 0 中制作了一个分组 UITableView 如下图所示 结果是 OS 3 1 中的正确图像 imageView 位于分隔符下方 我尝试将内容视图放在前面 当 tableView 处于分组样式时 我自己绘制分隔
  • JPA 与 Hibernate 3.6.8.Final、PostgreSQL 9.1、SQLGrammarException - 配置问题?奇怪的SQL语句

    Edit SOLVED正确的 我发现了让我困惑的事情 我使用 pgadmin 创建表和其他数据库内部结构 现在检查 如果名称 表名称 列名称 pk 名称等 中至少有一个字母为大写 则 pgadmin 在 SQL 创建脚本中使用它实际上 使用
  • ASP.Net 在会话 cookie 中存储用户密码?

    我知道会员资格提供商将用户名和过期时间存储在加密的 cookie 中 然后使用它来验证用户是否仍然登录会话 是否也可以将用户密码存储在这个加密的 cookie 中 如果是这样 您将如何在服务器端访问它 我需要服务器端可用的用户名和密码 因为
  • MySQL + Code First + 延迟加载问题!

    在一个非常简单的房地产程序中 我尝试使用 EF Code First 列出房屋的所有图像 附加到我拥有的现有数据库 我使用 MySQL Conector 6 3 6 这是我的代码 namespace CodeFirstMySQL class
  • 通过 unix shell 命令查找给定文件扩展名的首选应用程序

    这可能不是strictly关于编程 但如果我找不到现成的解决方案 它可能会成为一个编程任务 在 UNIX 上 用于确定给定文件类型的用户首选应用程序的命令行方法是什么 我理想的解决方案是一个命令 让我不必执行以下操作 okular foo
  • OnItemCLickLIstener 不适用于 ListView

    我有一个带有 ListView 的活动 具有自定义视图的 ListView 我将 OnItemClickLIstener 添加到 ListView 中 当我点击项目时 结果我什么也没看到 ListView 的活动
  • 从日期中减去时间 - 时刻 js

    例如我有这个日期时间 01 20 00 06 26 2014 我想减去这样的时间 00 03 15 之后我想将结果格式化为这样 3 hours and 15 minutes earlier 我怎样才能做到这一点使用moment js edi
  • useReducer Action 调度两次

    Scenario 我有一个返回操作的自定义挂钩 父组件 Container 利用自定义钩子并将操作作为 prop 传递给子组件 Problem 当从子组件执行操作时 实际调度会发生两次 现在 如果子级直接使用钩子并调用操作 则调度仅发生一次
  • 当我不知道它是否是临时的时,C++ 返回类型

    假设Foo是一个相当大的数据结构 我应该怎样写一个const返回实例的虚函数Foo 如果我不知道继承的类是否会存储Foo内部 因此 允许通过引用返回 如果我无法在内部存储它 我的理解是我无法返回const引用它 因为它将是临时的 它是否正确
  • 如何使用 Laravel + JavaScript 创建搜索过滤器?

    我最近创建了一个 JavaScript 过滤器来过滤产品表中的数据 我有 5 个字段可以输入搜索 它们是 描述 型号 经销商和库存 我将表与另一个视图中的产品分开 并将字段保留在索引中 我需要该表返回我在字段中输入的值 我举了一个用 描述
  • WP7 检查互联网是否可用

    我的应用程序 WP7 未被接受 因为如果互联网不可用 它无法加载 我寻找一种方法来检查它并找到了这个命令 NetworkInterface GetIsNetworkAvailable 但它无法在模拟器上运行 而且我没有任何设备来测试它 有人
  • 在 git-svn 中克隆主干后克隆分支的最佳方法是什么?

    给定一个包含许多分支的大型 Subversion 存储库 我想开始使用git svn通过克隆trunk首先 然后添加特定分支 我看到至少三种方法可以做到这一点 但是其中任何一种都是 官方的 还是有最好的方法 假设以下布局 https svn
  • Delphi 6:在缺少抽象类方法时强制编译器错误?

    我使用的是 Delphi Pro 6 现在 了解类是否缺少基类抽象方法的唯一方法是等待 IDE 发出 包含抽象方法 base class 抽象方法名称 警告或在尝试调用缺少的方法时等待运行时抽象错误方法 前者是不够的 因为它只查找当前项目中
  • 如何在 log4j 中启用包级别日志记录

    谁能告诉我 log4j 中的包级别日志记录是什么 以及如何实现这一点 今天我的面试问题无法回答 即使我在谷歌中也没有找到好的解决方案 太感谢了 包级别日志记录是 log4j 的标准日志记录 使用 log4j 配置 您可以指定包和关联的级别
  • 将 std::wstring 转换为 int

    我认为这非常简单 但我无法让它发挥作用 我只是想将 std wstring 转换为 int 到目前为止我已经尝试了两种方法 第一种是将 C 方法与 atoi 一起使用 如下所示 int ConvertedInteger atoi OrigW
  • 如何让传单地图画布具有 100% 的高度?

    我的传单画布目前如下所示 高度为 700 像素 不过我希望它的高度为 100 以便占据整个空白区域 高度 100 在地图画布的 CSS 属性中不起作用 我找到了一些解决方案 但它们只适用于谷歌地图 有没有人有解决方案 即使这只是一个解决方法