尽管％宽度和高度为

Question

我目前面临浏览器调整大小的问题。当页面处于完整大小时（即浏览器窗口没有被最小化），页面运行良好，产生了这个：

然而，当我最小化窗口时，通过垂直压缩使窗口变小，会发生这种情况：

内容已被切断，我无法滚动查看已调整大小的浏览器窗口中的完整内容。

我知道这是一个常见问题。我试图通过确保：

来解决这个问题

• 任何宽度都以％表示（事实上，一切都很好 关于宽度）
• 高度为auto（以便它们包含必要的内容）

如果没有成功，我将高度值替换为％值，而不是简单地使用auto，确保总高度值不超过100％。不幸的是，这也没有成功。知道为什么，以及我能做些什么来使这项工作？提前谢谢！

我可以在此处找到我的HTML和CSS：https://codepen.io/anon/pen/yoBEWb

Answer 1

尝试使用<div class="bg"></div>

更改height: 100vh;

Answer 2

您可以使用媒体查询来正确调整屏幕大小并调整内容。基本上，媒体查询类似于规则，例如：如果我的屏幕高度小于或等于480px，请减小字体大小，将其放在下面...更多信息here。