css - 如何将此媒体查询与特定 ID 结合起来

Question

我正尝试在我的 WordPress 网站上使用现有媒体查询显示 100% 宽度的 iframe，我想弄清楚我是否可以将 iframe id 定位为不受原始媒体查询影响或将其与一个独特的媒体查询，仅通过 iframe 获得全帧效果。

这是原代码

@media only screen and (max-width: 767px) {
    .responsive #top #wrap_all .container {
        width: 85%;
        max-width: 85%;
    }
}

这就是我需要它运行的方式，但只能使用 id 标签 #frame

@media only screen and (max-width: 767px) {
    .responsive #top #wrap_all .container {
        width: 100%!important;
        max-width: 100%!important;
    }
}

我觉得这离完成还有几秒钟，但我不确定如何完成它。

Answer 1

你的问题不是很清楚。然后，如果您的唯一 iframe ID 是 #frame，您可以定位它:

@media only screen and (max-width: 767px) {
    /* your iframe */
    .responsive #frame { 
        width: 100%!important;
        max-width: 100%!important;
    }
}

您可以添加更多规则，也可以在此媒体查询中定位其他选择器......