两种分辨率之间的媒体查询

Question

如果 his/her 屏幕的分辨率是这样的，我正在搜索如何使隐藏部分显示给用户：

如果宽度 < 1024 像素且高度 < 640 像素

最小宽度 1440px 和高度 < 900px

然后显示 div。

我一直在为最小宽度、最大高度而苦苦挣扎，但没有成功。

例如： @media screen (max-width: 1023px) and (max-height: 639px), and (min-width: 1440px) and (max-height: 899px)

但正如我在构建它时所预期的那样，它不起作用。

关于如何实现这一点有什么想法吗？

Answer 1

我正在使用以下内容：

/* ----------- 0 - 450px ----------- */
@media screen 
  and (max-width: 450px){
}

/* ----------- 450 - 650px ----------- */
@media screen 
  and (min-width: 451px) 
  and (max-width: 650px){
}

/* ----------- 650px - 950px ----------- */
@media screen 
  and (min-width: 651px)
  and (max-width: 950px){
}

/* ----------- 950px - 1200px ----------- */
@media screen 
  and (min-width: 951px) 
  and (max-width: 1200px){
}

/* ----------- 1200px + ----------- */
@media screen 
  and (min-width: 1201px){
}

如果你在你的 HTML 中使用它，它就像黄金一样好用：

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

调整身高，你应该设置。

两种分辨率之间的媒体查询

Media queries between two resolutions

css

media-queries

responsive