如何在启用CORS的情况下将css应用于IFrame

时间:2016-10-17 06:39:24

标签: css cors

子域名http://board.woodstockschool.in将在my.woodstock.ac.in的iframe中显示内容。

在my.woodstock.acin的HTTP标题中,它确实有这个条目:

Access-Control-Allow-Origin => http://board.woodstockschool.in

但是我无法使用来自board.woodstockschool.in网站的CSS更改内容。

我也试过这些:

a ,iframe a{
color: red !important;
}

这会更改除iframe之外的所有链接的颜色。

这里有一系列问题,例如How to apply style to a div which is inside an iframe of the page?,但没有启用CORS。

我已经检查了https://www.w3.org/wiki/CORS_Enabled#For_Apache,但没有在那里找到css。

在不使用任何javascript的情况下,从包装网站应用css规则的方法是什么?

2 个答案:

答案 0 :(得分:1)

  

从包装网站

应用css规则的方法是什么?

没有办法。

你最接近的可能是:

  • 在iframe src上设置查询字符串,然后让嵌入页面使用服务器端代码将<link>粘贴到样式表中。
  • 使用postMessage向嵌入页面发送消息(可能包括样式表的URL),然后在嵌入页面上运行JavaScript,添加<link>

CORS不会帮助或妨碍您。这完全无关紧要。

答案 1 :(得分:0)

最好的方法可能是以下(如果你控制两个网站):

1)使用style参数设置iframe链接,例如:

http://your_site.com/target.php?style=a%7Bcolor%3Ared%7D

(最后一个短语是由a{color:red}函数编码的urlencode


2)像这样设置接收者页面target.php

<head>
..........
<style><?php echo filter_var($_GET['style'], FILTER_SANITIZE_STRING);?> </style>
..........