通过iframe模拟移动屏幕大小

Question

只是一个随机的想法,如果我想通过调整浏览器窗口的大小来展示响应式网页设计,但实际上将响应式网站加载到与移动屏幕具有相同尺寸的IFRAME中,该怎么办？这可以吗？

假设我有一个IFRAME

<iframe src="something" id="viewPort"/>

加载响应式网站.然后让用户通过调整浏览器中的iframe宽度和高度进行测试.

如果这可以工作,对于不了解浏览器的客户来说,这可能是一个福音.

Answer 1

我赢了:)有一个,众所周知,你可以使用或学习.

http://mattkersley.com/responsive/

更具体地说,iframe绝对允许你改变height,width并且它的内容确实对此做出反应 - 也就是说 - @media有效.

Answer 2

您可以使用 iframe 的 HTML 属性，seamless它会在您提供的宽度上呈现，就像 iPad 一样：

<iframe src="yourURL" seamless width="768" height="1024"></iframe>

此外，如果您想在 XHTML 文档中使用它，因为禁止属性最小化，您需要将其定义为<iframe seamless="seamless">.

编辑： 不幸的是，根据w3schools的说法，无缝属性已贬值，浏览器不再支持它，尽管我仍然可以使用它。