如何解決 iOS 上的 Iframe 大小調整問題：CSS 解決方案？

使用CSS 克服iOS 上的iframe 大小調整問題

如果您在iOS 設備上遇到iframe 溢出其指定幀大小的問題，儘管在其他瀏覽器上正常工作，本指南將提供一個解決方案。

簡而言之，iOS Safari 不遵守使用 CSS 設定的傳統 iframe 大小限制，導致 iframe 調整大小以適應其內容。為了解決這個問題，我們使用一個包裝div 來調節溢出：

<code class="css"><div class="frame_wrapper">
    <iframe class="my_frame">
        // Content
    </iframe>
</div></code>

以下CSS 屬性應用於包裝div：

<code class="css">.frame_wrapper {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    /* Additional CSS styles... */
}</code>

overflow 屬性控制溢出的處理內容，將其設定為自動允許捲軸根據需要出現。 -webkit-overflow-scrolling 屬性特定於 iOS 設備，可實現流暢的滾動體驗。

透過將 iframe 封裝在此包裝器 div 中，我們可以控制溢出行為並指示 iOS Safari 遵守所需的 iframe 尺寸。您可以在此處檢查更新後的範例：http://jsfiddle.net/R3PKB/7/

此解決方案解決了iOS Safari iframe 處理中長期存在的錯誤，這一點已在之前的Stack Overflow 討論中得到證實。

以上是如何解決 iOS 上的 Iframe 大小調整問題：CSS 解決方案？的詳細內容。更多資訊請關注PHP中文網其他相關文章！