防止窗口从某个点垂直向下调整大小答案

【问题标题】：Preventing window from resizing vertically from a certain point and downwards防止窗口从某个点垂直向下调整大小
【发布时间】：2019-06-26 04:32:21
【问题描述】：

我正在使用引导程序创建一个站点。

我想阻止窗口从某个点向下调整大小。

我目前将其设置为：

html, body{

 min-width: 300px;
 max-width: 3000px;
 min-height: 550px;
 max-height: 1500px;

}

似乎可以完美地适应宽度，一旦窗口宽度达到 300 像素，窗口的宽度就会锁定并且不能进一步缩小。

但由于某种原因，它不适用于高度，无论我设置什么参数和尺寸，我都可以完全缩放它的高度。

不知道如何解决这个问题，以便一旦窗口达到 550 像素的高度，高度也会锁定并且不能进一步缩小。

任何帮助将不胜感激。谢谢！

【问题讨论】：

【解决方案1】：

这不是问题，实际上您所说的是设备宽度而不是文档或窗口宽度，如果您担心响应能力，那么世界上不存在可以更改高度的设备，至少我不知道，

这应该不是问题，您正在缩放浏览器（设备）的高度和宽度，但实际的窗口大小与宽度一样，,,

我的意思是 css 代码工作正常，但你没有注意到，

【讨论】：

【解决方案2】：

这是因为 max-height 会覆盖 height，但 min-height 总是会覆盖 max-height。所以你不能以你想要的方式使用它们。

您需要以媒体查询为目标：

body { height:550px }
@media (min-height: 550px) { body {height: 100vh }}
@media (min-height: 1500px) { body { height: 1500px }}

【讨论】：