android - 媒体查询未在 Ipad 应用程序上显示任何输出

Question

我已经添加了我的媒体查询，当我在这个 site 下运行时似乎它没有显示我预期的正确输出..这是我为这个手机做的第一次测试

这是我的媒体查询

@media screen and (min-width: 768px) and (max-width: 1024px), (min-device-width: 768px) and
(max-device-width: 1024px) and (orientation : landscape) {
    .wrap{
        width:95%;
        }

     .box{
     width:29.33%;
      float:left;
      margin:0px 42px 0px 0
    }   

    html{
        background-color:red;
    }
}

我对 body 和 html 进行了故障排除，但是没有显示背景颜色

这是我的 site

我的 CSS

.wrap{
    width: 90%;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
}

.box{
    width: 29.33%;
    float: left;
}

Answer 1

I have added my media Queries

但是您忘记了媒体查询中的一个关键要素，即元视口(viewport)元素。例如。

<meta name="viewport" content="width=device-width, initial-scale=1">

您需要将其放在页面的 head 中，以便媒体查询运行。