剛進公司的時候,接手的項目裏就遇到了這樣的問題,iframe外部使用js設置了html的font-size,以便使用rem。在安卓的表現很正常,然而在ios裏,iframe裏面的內容無法做到自適應,致使子頁面元素的寬將iframe撐開。
爲了解決這個問題,網上找了幾個方法,都試了下,最後找到了解決方法。
<iframe src="test.html" style="width: 1px !important; min-width: 100%;" frameborder="0" scrolling="no"></iframe>
在iframe標籤中,加上scrolling強制沒有滾動條;
採用 width: 1px !important;,用最高的權限改變iframe的寬(如果不用這個,子頁面元素的寬會將iframe撐開);
如果再需要改變iframe的寬,可以選擇 min-width 來設置。