Экстренные скобки вызывают простой запрос СМИ к ошибке

Question

Я просто наткнулся на странную вещь и задавался вопросом, не ожидается ли это поведение или какая-то ошибка.

Мое намерение состоит в том, чтобы написать следующий код, но я сузил проблему (см. Ниже).

@media only screen 
and (
    (-webkit-min-device-pixel-ratio: 1.2), /* or */ 
    (min-resolution: 120dpi) 
) { ... } 

Этот код работает:

@media only screen 
and (-webkit-min-device-pixel-ratio: 1.2) { ... } 

добавить дополнительные внешние скобки, это не удается:

@media only screen 
and ((-webkit-min-device-pixel-ratio: 1.2)) { ... } 

Целевая платформа является последним Chrome на Android 5.1, но я открыт, чтобы услышать комментарии на других платформах тоже.

Answer 1

Это зависит от того, какое поведение вам необходимо подойти. Требуется ли and или or для этих правил

Если вы хотите применить оба правила для запроса средств массовой информации, вам нужно использовать and логический оператор

@media only screen and (-webkit-min-device-pixel-ratio: 1.2) 
        and (min-resolution: 120dpi) 
{ ... } 

Если вы хотите применить какие-либо одно из правил для медиа-запросов, необходимо использовать запятой:

@media only screen and (-webkit-min-device-pixel-ratio: 1.2), 
     only screen and (min-resolution: 120dpi) 
{ ... }