Что такое медиа-запрос для больших настольных компьютеров?

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

@media (min-width: 992px) and (max-width : 1200px){//This should work for Normal desktops(15 to 18 inch) only.
}

Ответ 1

Задачи оптимизации для крупномасштабных дисплеев сосредоточены вокруг того, как масштабировать и управлять контентом. Вы должны принять ширину экрана в определенных точках.

Пример: для класса "контейнер"

@media screen and (min-width: 1400px) {
  .container {
    width: 1370px;
  }
}
@media screen and (min-width: 1600px) {
  .container {
    width: 1570px;
  }
}
@media screen and (min-width: 1900px) {
  .container {
    width: 1870px;
  }
}

Ответ 2

Вы также можете попробовать любой из этих

@media only screen  and (min-width : 1224px) {
/* Styles */
}


@media only screen  and (min-width : 1824px) {
/* Styles */
}

Ответ 3

если вы хотите нацелить больший экран в CSS, то вы должны определить критерии ширины для большого разрешения. Я имею в виду, если вы хотите настроить таргетинг на экран 4k

    @media (min-width: 2000px) {
    }

В медиазапросе разрешение экрана учитывается для размера экрана. И когда вы выбираете размер экрана с помощью css, вы должны указывать диапазон разрешения экрана.

Ответ 4

Просто проверьте, какие размеры экрана вам нужны для стилей различий. затем используйте медиа-запросы по мере необходимости. ;)

@media screen and (min-width: 1400px) {}

@media screen and (min-width: 1600px) {}

@media screen and (min-width: 1900px) {}