如何将CSS应用于iframe？

Question

我有一个简单的页面，其中包含一些iframe部分（以显示RSS链接）。如何将相同的CSS格式从首页应用到iframe中显示的页面？

Answer 1

编辑：除非设置了适当的CORS标头，否则这不能跨域工作。

这里有两件事：iframe块的样式和嵌入在iframe中的页面的样式。您可以按通常方式设置iframe块的样式：

<iframe name="iframe1" id="iframe1" src="empty.htm" 
        frameborder="0" border="0" cellspacing="0"
        style="border-style: none;width: 100%; height: 120px;"></iframe>

必须通过将iframe中嵌入的页面样式包含在子页面中来进行设置：

<link type="text/css" rel="Stylesheet" href="Style/simple.css" />

或者可以使用Javascript从父页面加载它：

var cssLink = document.createElement("link");
cssLink.href = "style.css"; 
cssLink.rel = "stylesheet"; 
cssLink.type = "text/css"; 
frames['iframe1'].document.head.appendChild(cssLink);