媒体查询 - 组合AND / OR

Question

我正在尝试创建一个媒体查询，在伪代码中，读取如下：

@media min-aspect-ratio: 4/3 AND (min-width: 550px OR min-height: 550px)

但我无法弄清楚正确的语法。到目前为止，我能想到的最接近的是：

@media all and (min-aspect-ratio: 4/3) and ((min-width: 550px), all and (min-height: 550px))

因为在媒体查询中，逻辑或等同于逗号分隔值，因此min-width或min-height。

有人可以协助吗

Answer 1

自

A and (B or C) 

可以扩展为

(A and B) or (A and C)

然后你可以将表达式转换为

@media (min-aspect-ratio: 4/3) and (min-width: 550px),  // A and B
       (min-aspect-ratio: 4/3) and (min-height: 550px)  // A and C

逗号（,）等同于or条件