CSS @media not（min-width）不起作用

Question

Demo

当调整结果大小低于400px时，@media not (min-width: 400px)无效，我知道我可以使用@media (max-width: 399px)，但我想知道为什么不工作

Answer 1

试试这个：

@media not screen and (min-width: 400px)

Demo

Answer 2

min-width 400px意味着设备应至少具有400px的宽度。 当您将窗口大小调整为400px以下时，您为最小宽度编写的规则：400px将无法正常工作。

max-width：399px表示最大宽度为399px。当您将窗口大小调整为399px以下时，为max-width 399px编写的规则将起作用。