• iframe在iphone6 plus的safari下子页面的宽度不受父页面控制的bug


    这是想要的效果:

    样式设置是iframe外面的宽度为100%,iframe的宽度为父元素的90%,高度为宽度 除以1.6,固定比例,

    正常显示就是上面的样子,但是,问题出现在iphone特定手机特定版本的safari浏览器上,在它上面会出现:

    这样的情况。检查了一下,发现原因了:

    在iframe里面的页面没加载出来之前,iframe的宽和高是正常的,当里面的页面加载完了之后,宽度就会发生变化,当然,

    高度也相应改变。父页面中显示出来的iframe宽和高其实是子页面的真实宽高!也就是说子页面的宽高没有收到CSS跟JS

    的限制(js有改变width的值)。

    后来谷歌了一下,找到了解决方法,特来记下:

    1:<iframe src="" frameborder="0" id="pptFrame" scrolling="no"></iframe>,

    在iframe标签中,加上scrolling强制没有滚动条

    2:采用 1px !important,用最高的权限改变iframe的宽(如果不用这个,子页面元素的宽会将iframe撑开);

    如果再需要改变iframe的宽,可以选择min-width,或者使用XXpx !important

  • 相关阅读:
    HTML 基础 元素 标签
    HTML5 元素介绍
    网站程序 模板下载 下载 ftp
    域名解析和空间绑定
    如何选择云虚拟主机操作系统?
    网站备案查询
    响应式网站01
    项目中使用百度统计和友盟统计
    项目中使用http referer,为了盗取图片资源
    vue-awesome-swiper中的数据异步加载
  • 原文地址:https://www.cnblogs.com/wuzhiquan/p/5358731.html
Copyright © 2020-2023  润新知