Question

我想根据屏幕分辨率编写媒体查询。我的屏幕分辨率高度是768.我为此写了媒体查询：

UIAlertController

我的上述媒体查询无法正常工作。之前未设置过margin-top。我根据屏幕分辨率而不是浏览器高度编写了媒体查询。

Answer 1

使用：

@media screen and ( min-width: 850px ) and ( max-height: 768px )
{
   .video-contain{
     margin-top:110px;  
    }
}

注意 ：始终使用max-width媒体查询效果很好。

Answer 2

问题似乎是您的视口不是屏幕的完整分辨率。

如果你将min-height设置为较低的值，例如720px，它应该可以工作。

 @media(min-height:720px) and (max-height:850px)
{
   .video-contain{
     margin-top:110px;
    }

 }

Answer 3

请试试这个：

@media only screen and (min-width: 768px) and (max-width: 850px) {
}

Answer 4

你可以这样定义。

@media screen and (max-width: 1600px) and (max-height: 900px){
    //code here
}

@media screen and (max-width: 1600px) and (max-height: 1200px){
        //code here
}

或者避免提及宽度

@media screen and (max-height: 1200px){
            //code here
}

Answer 5

//simple max-width query
@media screen and ( min-height: 600px ){
    background: blue;
    ....
}

这可能会对你有帮助。

Answer 6

@media only screen and（max-width：375px）and（max-height：667px）{ }

媒体查询最小高度

6 个答案: