如何同时考虑响应的宽度和高度？
how to take into account both the width and the height for the responsive?
我试图让我的网站响应（使用我首先构建桌面的媒体查询），使用 responsive/adaptive 模式和 firefox (f12) 在宽度级别找到断点。虽然我认为这很好，但一旦我更改高度或使用 ipad pro 作为模板，我的所有响应都会因为高度而被破坏。我觉得奇怪的是，据我所知，媒体查询似乎是基于宽度的，那么如何考虑不同的高度呢？
您可以向媒体查询添加高度要求，如下所示：
<style>
body {
background-color: yellow;
}
@media only screen and (max-width: 600px) and (max-height: 500px) {
body {
background-color: lightblue;
}
}
</style>
我试图让我的网站响应（使用我首先构建桌面的媒体查询），使用 responsive/adaptive 模式和 firefox (f12) 在宽度级别找到断点。虽然我认为这很好，但一旦我更改高度或使用 ipad pro 作为模板，我的所有响应都会因为高度而被破坏。我觉得奇怪的是，据我所知，媒体查询似乎是基于宽度的，那么如何考虑不同的高度呢？
您可以向媒体查询添加高度要求，如下所示：
<style>
body {
background-color: yellow;
}
@media only screen and (max-width: 600px) and (max-height: 500px) {
body {
background-color: lightblue;
}
}
</style>