您的位置：首页 > 其它

iframe 跨域高度自适应的解决办法

2016-10-31 15:33 309 查看
body { overflow: hidden; margin-bottom: 52px }

1 <html>
2 <head>
3     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=5.0" charset="UTF-8">
4     <meta name="apple-mobile-web-app-capable" content="yes">
5     <meta name="apple-mobile-web-app-status-bar-style" content="black">
6     <meta name="format-detection" content="telephone=no">
7     <style>
8         body{
9             overflow: hidden;
10             margin-bottom: 0px;
11         }
12     </style>
13 </head>
14 <body>
15 <iframe src="https://www.baidu.com/" width='100%' height='100%' frameborder='0' name="iframeCont" id="iframeCont" ></iframe>
16 </body>
17 </html>


这是我在一个博客上看到的实现方法，确实很管用，没有用任何的js。但是我是在手机上用，出了一点小问题，有文本框的情况下点击输入法页面高度就停留在半空不能自适应，经过测试，得到一下解决办法：

1 <style>
2 body{
3     position: absolute;
4     width: 100%;
5 　 height:100%;
6     left:0;
7     top:0;
8     overflow: hidden;
9 }
10 #iframeCont{
11     margin-bottom: 0px;
12 }
13 </style>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航