Html CSS媒体查询没有响应

我知道这个问题在这里出现过好几次，但我没有从中找到我想要的答案

基本上，我创建了800x600分辨率的网页，因为我想从这一点上调整桌面上不同分辨率的网页。在继续之前，我想问一下，使用%或px来定义元素的最佳选项是什么

假设我有一个网络，我想调整它以适应不同的分辨率。大约有12个可用于桌面。如果我想让网站在每个页面上都能正常显示，我应该为每个页面编写代码，对吗？确定屏幕分辨率的最佳方法是什么？800x600工作正常，1024x600也工作正常。然而，由于某些原因，1024x768没有成为目标。我将在这里发布代码：

.scene {
  padding: 0;
  margin: 0;
}

.fill {
  position: absolute;
  bottom: 0%;
  right: -1%;
  left: -2%;
  top: -10%;
}

.expand-width {
  width: 101%;
}

@media only screen and (min-width: 1024px) and (max-height: 600px){}

@media only screen and (min-width: 1024px) and (min-height: 601px){

    body{background-color: red;}

        .fill {
  position: absolute;
  bottom: 0%;
  right: -1%;
  left: -2%;
  top: -10%;
}

    .expand-width {
  width: 101%;
}
    }

---

首先，您使用的是媒体查询，因此%或px不是问题，因为媒体查询仅用于解决该问题。但要获得真正的响应性，你可以选择%

接下来，您将为1024*600进行设计，因此其中包含1024*768，这就是ir不影响代码的原因

---

试试看！对于1024*768分辨率样式很重要。

试着缩小以产生“伪高rez”，这是我的错，我没有复制到这里。我将编辑它实际上我希望最大高度：600px和最小高度：601px能够区分分辨率。不，不！重要的是，没有做任何事情。很好，你可以拥有它，但你不能拥有1024*600，所以1024*768在一起。一种样式将重写另一种样式。你写的是什么？

@仅媒体屏幕和（最小宽度：1024px）和（最大高度：768px）{}

或

@仅媒体屏幕和（最小宽度：1024px）和（最小高度：768px）{}

@media-only屏幕和（最小宽度：1024px）和（最大高度：768px）{}-这将适用于我想要的内容。那么，为什么1024x768会覆盖1024x600？