css - iframe 上高度和宽度的最大值和最小值

Question

一直在为 Iframe 做媒体查询。下面这两个媒体查询在编辑高度和宽度时适用于 iframe

min-device-width: 768px) and(max-device-width: 1024px) 
min-device-width: 600px) and (max-device-width: 960px)

然而，当在 htc 手机上查询时，它不会对其大小做任何事情..最小设备宽度:360px)和(最大设备宽度:640px)

这是我的代码

@media screen and (min-width: 360px) and (max-width: 640px),(min-device-width: 360px)and
(max-device-width: 640px) and (orientation : landscape)
 {
    /* CSS */

    .wrap{
        width:75%;
    }
    .iframe {
    max-height:30vh;
    max-width:30%;
    }
    .html{

        background-color:red;
    }


}

即使在尝试进行故障排除时背景颜色也不起作用

Answer 1

这可能是由于设备的高分辨率，因此永远不会触发查询。尝试指定 resolution units on your media queries .

否则只需使用 min-height 和 min-width 媒体查询。它们更可靠。