加载特定于iframe大小的媒体查询

Question

我正在尝试为响应式广告加载同一HTML的多个实例。理想情况下，此广告都会来自同一个HTML源（ad.html），然后针对每种广告尺寸提供不同的响应式CSS。然后，我们需要做的就是将iframe的大小指定为我们配置的选项之一，这是针对多种广告尺寸的解决方案。

现在，这是问题所在。在加载大小的iframe时，广告的CSS无法将该iframe的大小识别为其边界框，而是整个浏览器。因此，我们的特定尺寸的媒体查询失败了，没有它，整个想法就毫无意义。

有没有办法做我想做的事情？我在媒体查询上使用简单的最小和最大宽度，所以除非我弄错了，否则它们应该加载到iframe的维度。

Answer 1

我能够通过将媒体查询从最小宽度更改为最大宽度来解决此问题。完成此操作后，浏览器会正确识别每个特定iframe的媒体查询。

此外，如果您在一个页面上多次加载相同的iframe，IE将无法识别四个媒体查询。