媒体查询无效

Question

我有这个简单的媒体查询：

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

   body {
      font-size: 14px;
   }

}

但这不起作用。我的屏幕分辨率是1600x900，所以它应该可以工作，我想。这到底有什么不对吗？我把它放在.css文件的末尾，我添加了

<meta name="viewport" content="width=device-width,initial-scale=1.0">

到HTML文件......我不知道我还应该做些什么来使这个工作。

Answer 1

min-width and max-width指的是窗口的宽度，而不是屏幕的宽度。 @media screen表示样式适用于“屏幕”媒体（例如，与“打印”媒体相对）。

要定位分辨率，您可以使用min-resolution and max-resolution。