在iframe中使用Google Maps API来防止CSS冲突？

Question

是否有一种简单的方法可以使用Google Maps API，以便地图以iframe显示而不是内联？我想这样做是因为some WordPress templates have CSS rules that are applied to the Google Maps elements too，给出了奇怪的结果。当前默认主题的一个示例：帖子内容中的图片获得97.5％的max-width，这会在地图图块之间产生这些差距：

假设这是针对将在不同主题中使用的插件，因此我无法控制基本CSS。我认为有三种方法可以解决这个问题：

1. 在我的插件中添加额外的CSS规则，重置所有可能存在冲突的基本规则（很难做到，野外有很多奇怪的设置 - max-width: 97.5%只有一个）。
2. 要求Google在其CSS中添加更多!important规则以防止出现这类冲突（同样困难，Google也可能不愿意这样做）
3. 只需将地图放入iframe
即可

如果您有更好的建议来防止这些冲突，我想了解它们。

Answer 1

就像将地图放在iframe中一样简单，将iframe大小设置为地图大小，并使用frameborder=0

删除iframe边框

---

编辑：您还必须删除地图页面上的填充/边距。

<强> map_page.html

html, body { margin: 0, padding: 0 }