Мин-Высота или Макс-Высота для отзывчивости? - PullRequest
Новая
       3

Мин-Высота или Макс-Высота для отзывчивости?

0 голосов
/ 03 марта 2020

У меня вопрос по поводу отзывчивости дизайна, когда дело касается высоты, при разработке для адаптивного дизайна, лучше ли использовать 

@media (max-height: 2160px)

или 

@media (min-height: 2160px)

У меня есть куча правил, основанных на минимальной высоте в файле css, и я думаю, что использование минимальной высоты вызовет у меня проблемы, тем более что в данный момент я использую телевизор 4kuhd в качестве монитора и работаю вниз , Я также использую jquery для настройки высоты и ширины, так что все сталкивается друг с другом, и кое-что я должен оставить в руках jquery, чтобы установить высоты и ширины

РЕДАКТИРОВАТЬ 

@media (min-height: 768px) {
    #Container {
        width: calc(100% - 20px);
        height: 96vh;
        border: 1px solid black;
        background-color: red;
    }
}

@media (max-height: 1080px) {
    #Container {
        width: calc(100% - 20px);
        height: 96vh;
        border: 1px solid black;
        background-color: purple;
    }
}


@media (max-height: 2160px) {
    #Container {
        width: calc(100% - 20px);
        height: 96vh;
        border: 1px solid black;
        background-color: hotpink;
    }
}

Когда я оставляю разрешение экрана 3840x2160, фон становится ярко-розовым, когда я изменяю разрешение до 1920 x 1080, он все равно остается ярко-розовым, если я опускаю его ниже, чем 1920x1080, затем он становится фиолетовым.

Я не понимаю, почему, когда я опускаю его до 1920x1080, он не меняется на фиолетовый

РЕДАКТИРОВАТЬ 2

Мне кажется, я понял, почему это не работает, и, пожалуйста, кто-нибудь исправит меня, если я ошибаюсь. Если я вычту 111 из этих экранов, тогда все работает. Но я понятия не имею, почему вычитание 111 из моего разрешения экрана работает.

...