Markdown Jekyll：插入一个填充容器的iframe

解释了如何在帖子中插入iframe。但是，我使用iframe作为传单地图。与此不同，我将地图代码存储在一个单独的位置html文件中，并在我的帖子的iframe中显示地图。我在github上托管了这个，所以我不能使用jekyll插件

---

我可以让地图显示出来，但我不知道如何确保iframe以响应浏览器窗口大小调整的方式填充博客容器。有没有办法只在博客文章的代码中指定这一点，或者我必须像这样创建我自己的css样式

我假设你正在为你的地图代码做

{%include mapName.html%}

，但无论哪种方式，你的问题都更多地基于容器和css样式，您可能需要编写自己的样式，以确保iFrame具有响应性，下面是一个示例，该示例取自并详细解释 （请同时参考该网站了解更多示例，因为这是一个非常详细的解释）下面是一个简短的流程示例，如该帖子所述：

为您的iframe创建一个id为的

div

：

<div class="video-container">
    <iframe src="http://www.youtube.com/embed/4aQwT3n2c1Q" height="315" width="560" allowfullscreen="" frameborder="0">
    </iframe>
</div>

最后设置

iframe

：

.video-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

也就是说，如果您的地图代码不是完全唯一的，您可以选择更简单的方法，不使用类似的服务处理任何CSS样式，我在自己的博客中嵌入视频和iFrame时使用它，因为它使用Javascript处理响应图像。

CSS Helper

.is-fullwidth {
    width: 100%;
}

降价

    <iframe src="http://www.youtube.com/embed/4aQwT3n2c1Q" class="is-fullwidth" height="315px"
    </iframe>

---

经过一点努力，我终于成功了。我已经放弃了在我的问题中链接到的博客文章中建议的解决方案，因为在我的标记文章中使用
打破了
之外的其他标记格式。事实证明（我想）这是因为我的主题使用了
red地毯
作为解析器。切换到
kramdown
工作正常。我不太明白你的第一句话。我目前正在使用QGIS中的一个插件生成一个独立的传单地图，它有自己的文件夹和自己的
index.html
，然后我正在使用iframe将地图嵌入到帖子中。@raphael啊，我明白了。我说的第一句话的意思是，你可以使用`{%include filename.html%}语法“插入”你想要的任何东西的片段，我想这可能是你正在做的事情。它用于包含标题栏，例如，下面是它的文档：
    <iframe src="http://www.youtube.com/embed/4aQwT3n2c1Q" class="is-fullwidth" height="315px"
    </iframe>