zoukankan      html  css  js  c++  java
  • iframe 跨域高度自适应的解决办法

     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>
  • 相关阅读:
    Linux显示2015年日历表
    Linux显示系统日期
    Dialogs 对话框
    grid 属性
    VS2010 fatal error LNK1123: 转换到 COFF 期间失败: 文件无效或损坏 嵌入清单
    Perl Tk grid 布局
    Perl Tk pack布局示例
    Perl Tk grid布局管理器
    Perl DBI模块
    输入文本框模型
  • 原文地址:https://www.cnblogs.com/cjqa/p/6016058.html
Copyright © 2011-2022 走看看