小编给大家分享一下ios设备使用iframe宽度超出屏幕如何处理,希望大家阅读完这篇文章之后都有所收获、下面让我们一起去探讨吧!
<>强场景
在做公司官网编辑项目时遇到iframe在苹果X手机上右侧超出屏幕的问题,感觉像是被截断一样,但是在其他手机上显示正常。
<强>分析
问题原因:页面一个利用iframe嵌入了b,同时设置iframe的宽度为100%,但是页面b的实际宽度要大于外层设置的100%。正常情况下,页面b的显示宽度应该为外层赋予的100%,但是在ios上,当iframe内真实宽度大于外层给予的宽度的时候,显示的宽度则为真实宽度。
<强>解决
1,给iframe的外层p添加样式:<代码>溢出:汽车;-webkit-overflow-scrolling:触摸;宽度:100%;
2,给iframe设置属性<代码>滚动=& # 39;没有# 39;
3,给iframe设置样式:<代码>宽度:1 px;min-width: 100%;*宽度:100%;
& lt; p比;“& lt; iframe高度=?00%;滚动=皀o"https://www.yisu.com/zixun/, src=" https://juejin.im/timeline ">
<强>附:iframe在IOS里如何自适应宽度?
iframe自动变宽了,在IOS手机上出现滚动条
第一步:定义iframe中滚动的属性为不,设置iframe中不显示滚动条。
& lt; iframe滚动=皀o"祝辞& lt;/iframe>
第二步:设置iframe的样式为如下所示
iframe{,溢出:滚动;,-webkit-overflow-scrolling:触摸;,min-width: 100%;,*宽度:100%;,宽度:1 px;}
看完了这篇文章,相信你对“ios设备使用iframe宽度超出屏幕如何处理”有了一定的了解,如果想了解更多相关知识,欢迎关注行业资讯频道,感谢各位的阅读!
