如何使用 CSS 設定 iFrame 內容的樣式？

使用 CSS 設定 iFrame 樣式

為了增強 iFrame 的外觀，通常需要對其內容套用自訂 CSS。然而，由於 iFrame 引用來自不同來源的內容，跨域限制可能會阻礙直接 CSS 應用。

對於透過本機檔案（例如file://）載入iFrame 內容的情況，其中跨網域策略不適用：

<code class="javascript">var cssLink = document.createElement("link");
cssLink.href = "file://path/to/style.css";
cssLink.rel = "stylesheet";
cssLink.type = "text/css";
frames['iframe'].document.body.appendChild(cssLink);</code>

使用jQuery：

<code class="javascript">var $head = $("iframe").contents().find("head");
$head.append($("<link>", { rel: "stylesheet", href: "file://path/to/style.css", type: "text/css" }));</code>

請記住，這種方法可能會產生安全隱患，因此在實施之前了解潛在風險至關重要。有關處理這些風險的更多信息，請參閱在 Safari 中停用同源策略的指南。

以上是如何使用 CSS 設定 iFrame 內容的樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！