本文介绍了整页< iframe>的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有以下示例代码。这适用于除移动设备上的浏览器之外的所有浏览器。

I have the example code below. This works fine with all browsers except for browsers on mobile devices.

溢出标记是问题。

适用于除移动设备以外的所有设备:

Works with all except for mobile:

margin: 0; padding: 0; height: 100%; overflow: hidden;

适用于所有手机而非计算机:

Works with all mobile and not computers:

margin: 0; padding: 0; height: 100%;

让它在两者上工作的最佳方式是什么?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Test Layout</title>
        <style type="text/css">
            body, html
            {
                margin: 0; padding: 0; height: 100%; overflow: hidden;
            }
        </style>
    </head>
    <body>
            <iframe width="100%" height="100%" src="http://www.cnn.com" />
    </body>
</html>


推荐答案

这是工作代码。适用于桌面和移动浏览器。希望能帮助到你。谢谢大家回复。

Here's the working code. Works in desktop and mobile browsers. hope it helps. thanks for everyone responding.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Test Layout</title>
        <style type="text/css">
            body, html
            {
                margin: 0; padding: 0; height: 100%; overflow: hidden;
            }

            #content
            {
                position:absolute; left: 0; right: 0; bottom: 0; top: 0px;
            }
        </style>
    </head>
    <body>
        <div id="content">
            <iframe width="100%" height="100%" frameborder="0" src="http://cnn.com" />
        </div>
    </body>
</html>

这篇关于整页&lt; iframe&gt;的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-06 23:36