Question

我有一个响应iframe，我在其中加载了一个bootstrap 3 HTML模板。我正在构建用户通过更改颜色/字体来自定义模板的能力。

我想要实现的是将HTML和CSS保持在大屏幕模式，并按照iframe响应浏览器更改的大小缩小图像。

使用this example我已成功在我的页面中创建了iframe响应。但是现在它的内容将更改为较小的页面/ iframe大小的移动CSS。

是否可以将iframe内容的视口修复为大中型屏幕？或者也许是一个响应式CSS类，它使用iframe更改来扩展内容？

在我的示例中，内容是A4页面格式，因此我根据示例中的建议创建了一个非常小的透明png，其中包含A4比率。

我的HTML是：

<div class="row">
    <div class="col-xs-12 template-preview-container">
        <div class="h_iframe">
            <img class="ratio" src="/img/app/iframe-background.png"/>
            <iframe src="http://my/template/link" frameborder="0" allowfullscreen></iframe>
        </div>
    </div>
</div>

将模板加载到iframe并仅强制使用桌面CSS

0 个答案: