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>
  • 相关阅读:
    反射的基础详解
    数组,排序,枚举
    继承,多态,抽象,接口
    视图层 view
    常用类Object,String类详解
    模板层 Template
    自定义注解
    Django 高级
    常用类Math,StringBuffer,包装类,Date
    内部类,异常
  • 原文地址:https://www.cnblogs.com/cjqa/p/6016058.html
Copyright © 2011-2022 走看看