6

使用 iframe 从我的网络空间调用网站，使用带有body {background-color: #222}.

iframe src 也使用这个 CSS 文件。问题是 iframe 中的主体需要另一种背景颜色。

试过了

iframe>body { background-color: #other }

有什么想法或建议吗？

4

6 回答 6

7

我假设 iframe 占据了您网站的一小部分。在这种情况下，我建议您只需使用与加载 iframe 大小相同的 div，并为该 div 提供正确的背景颜色。

或者：在 iframe 页面的源代码中包含样式属性：

<head>
    <style>body {background-color:#COLOR}</style>
</head>
于 2012-04-24T14:09:02.733 回答
5

这个问题类似于How to apply css to iframe content? . 基本上你可以使用 jQuery 来改变 iframe 中的 CSS 属性

$('#yourIframe').contents().find('body').css({
    background-color: '#333333'
});

编辑： 您可能需要在 iframe 加载时添加：

$('#yourIframe').load(function(){ 
    $(this).contents().find('body').css({
        background-color: '#333333'
    });
});
于 2012-04-24T14:13:12.190 回答
3

请记住，Javascript 只能修改具有相同站点来源的 iframe 的属性，否则您将收到安全错误。

协议、域和端口必须匹配。

于 2014-07-02T10:16:30.007 回答
2

我用过这个，它对我有用。（它太容易了！）

在你的 CSS 文件中放：

iframe { 背景颜色：橙色；}

只需将“橙色”更改为您需要的任何颜色。就是这样！

享受！

于 2013-07-18T14:17:57.690 回答
0

在 iframe 包含的页面中，链接另一个样式表，然后更改您希望的所有 CSS 样式。

于 2012-04-24T14:02:27.813 回答
0

使用 Javascript 我们可以将背景颜色添加到 iframe

 var x = document.getElementById("myframe");
    var y = (x.contentWindow || x.contentDocument);
    if (y.document)y = y.document;
    y.body.style.backgroundColor = "red";

参考w3schools

于 2016-01-30T06:09:43.487 回答