Есть ли медиа-запрос для отображения без сетчатки?

В соответствии со статьей о CSS-хитрости, медиа-запросы на будущее для отображения сетчатки глаза можно записать так:

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 

  /* Retina-specific stuff here */

}

Что если я хочу написать CSS-коды для отображения без сетчатки?

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

1 ответ

Решение

В этой статье, также о CSS-хитростях, говорится, что вы можете изменить логику с помощью not. Итак, в теории:

@media
not screen and (-webkit-min-device-pixel-ratio: 2),
not screen and (   min--moz-device-pixel-ratio: 2),
not screen and (     -o-min-device-pixel-ratio: 2/1),
not screen and (        min-device-pixel-ratio: 2),
not screen and (                min-resolution: 192dpi),
not screen and (                min-resolution: 2dppx) { 

  /* non-Retina-specific stuff here */

}
Другие вопросы по тегам