0

如果我有一个 iframe,打开 te url http://www.google.com,它会加载整个网页,除非有一个移动样式表,就像在桌面浏览器上一样,带有滚动条。如何让它像在智能手机上查看一样打开?

<iframe id="frame" src="http://www.google.com" width="320" height="480"></iframe>
4

3 回答 3

3

在 iframe 中加载页面时,网站无法指示浏览器伪装成移动浏览器。

您需要可以在不同的 URI 下访问框架中的页面,该 URI 默认提供移动内容和样式表,而不是使用任何类型的检测(无论是媒体查询、用户代理嗅探还是其他任何东西)。

于 2012-10-19T16:21:51.813 回答
0

让第三方网站像在 iframe 中的移动浏览器中一样加载的唯一方法是让浏览器本身发送适当的用户代理字符串。作为网站开发人员,这不是您可以控制的。

但是,如果您可以请求页面内容服务器端,您将发出 http 请求,并且可以控制您向其他服务器发送的用户代理字符串。在 .Net 中,您可以创建一个新的 HttpWebRequest 对象并在发出请求之前设置 UserAgentString。

请记住,这实际上是在“欺骗”其他服务器以返回适用于某些平台的内容。当您回复客户的请求时,您还将从您的服务器呈现其他人的内容。请务必检查您正在处理的任何网站内容的任何服务条款,以确保它不是问题。

于 2012-10-19T16:33:51.483 回答
0

好的..但是建议响应不是那么正确..可以将网站视为iframe中的智能手机..当然,该网站必须准备好响应式设计方法..但有可能

遵循以下 3 个步骤: 在步骤#2 css 代码中编辑 IFrame 的大小和边框。

1.)创建页面到框架创建一个名为“framepage.htm”的新网页,具有响应式设计能力(以我的简单博客为例),它将显示在 IFrame 窗口中。2.) 添加 IFrame 嵌入代码 选择并复制以下代码。将其粘贴到您希望 IFrame 窗口出现的 HTML 网页的内容区域。

<iframe name="Framename" src="http://mlaynessanchez.blogspot.com" width="400" height="200" frameborder="0" scrolling="auto" class="frame-area">
</iframe>

3.) 添加 CSS 代码 在模板全局样式 .css 文件的底部选择、复制和粘贴以下 css。css 高度和宽度将覆盖 IFrame HTML 代码。使用您的高度、宽度、边框和溢出选项编辑以下内容。

以下代码适用于响应式和非响应式网页。

.frame-area {
  display: block;
  width: 100%;  /* RESPONSIVE WIDTH */
  max-width: 400px;
  height: 300px;
  overflow: auto;  /* EDIT TO hidden FOR NO SCROLLBAR */
  border: #999999 1px solid;
  margin: 0px;
  padding: 0px;
  }

如果您没有全局 css 文件,请将上述代码添加到网页的 head 部分,就在以下标签之间的标签之前。

<style type="text/css">
  /* css code goes here */
</style>

来源:http ://allwebco-templates.com/support/S_script_IFrame.htm

于 2017-01-28T22:37:13.350 回答