首页 > 解决方案 > 关于媒体屏幕的简单问题。如何同时使用宽度和高度(每个都依赖于另一个)?

问题描述

所以我所拥有的是一个 with max-width: 992px,另一个是max-height: 732px and max-width: 992px。我想要的是媒体屏幕只有在高度和宽度都低于最大值时才做一些事情。
我有这个:

@media screen and (max-height: 753px) and (max-width: 992px){
}

应该如何?

Nvm,只是放在@media screen另一个里面。

标签: css

解决方案


您可以使用嵌套媒体查询。像这样的东西

@media (max-width:992px) {
    @media (max-height:432px) {
        .test-div{
            background-color: blue;
        }
    }
}

推荐阅读