css - 调整窗口大小时调整html元素的CSS技巧

Question

我打算为移动开发一个网页。我需要调整具有屏幕宽度的窗口元素的大小。假设我创建了一个带有一些文本字段的表单。当屏幕宽度较宽时显示适合。但如果屏幕的高度较长且宽度较小，则表单元素（文本框、标签等）会重叠或隐藏，只有很少的角落部分。

如果我将屏幕大小调整为更小，然后显示 HTML 元素应该自动更小以适应屏幕大小，我该怎么做。

请提出您的建议。

谢谢，迪帕克

Answer 1

最好的解决方案是使用媒体查询

使用它们，您可以为不同的设备宽度应用单独的样式，并确保您的所有页面（和表单）在每个屏幕上看起来都很漂亮。

这也将有助于避免页面失真或使文本变得难以阅读，当您尝试将专为更宽屏幕设计的页面压缩到狭窄的移动设备时可能会发生这种情况。

Answer 2

我建议您使用百分比尺寸和box-sizing: border-box;