Javascript 如何根据缩放、分辨率和窗口大小适当缩放网页？

我正忙于开发一个web应用程序，但我似乎找不到正确的方法来缩放所有项目，使其适合屏幕

如图所示，灰色条是菜单，需要保持在原位。中间的内容（包括白色背景的蓝色块）需要左右移动，也可以上下移动。调整窗口大小、缩放和其他任何因素都应考虑在内。我目前的技术失败了很多次，所以我希望你们中有人知道一些好的技术

正如我所说，内容需要上下左右移动。所有页面的父div的宽度与所有页面的宽度相同。因此，一页应该具有正确的窗口宽度。高度也一样，但横轴上只有两页。目前我正在使用JavaScript/JQuery调整大小

正如旁注一样，当当前内容页大于屏幕显示时，可能会垂直滚动。水平滚动是不可能的

---

很难解释，我已经尽力了，但我希望有人能帮助我。

这很有趣！也许与em单位合作会对你有所帮助。这是一个巧妙的小把戏

1-在父容器上将字体大小设置为100%

2-在所有子元素中，对所有尺寸、填充、边距、边框、字体大小等使用ems

3-在Javascript中，当页面加载时，捕获浏览器维度并将其保存到变量以供以后使用

4-设置窗口大小调整事件。当窗口调整大小时，获取新的浏览器尺寸。现在，一些基本数学将允许您将新的浏览器尺寸与原始浏览器尺寸进行比较，并获得一个百分比

5-仍然在调整大小事件中，将新百分比设置为父元素的字体大小

你可以用你的中心容器或者其他什么东西来设置。具有font size属性（并且在ems中定义）的主容器的任何子元素都将随浏览器窗口自动缩放

文本将按比例缩放 边框大小将按比例缩放 边界半径将按比例缩放 尺寸、填充、边距将按比例缩放

---

很整洁。

你在这里问了很多非具体问题，但并不是所有问题都有明确的答案。如果你想让StackOverflow对你有所帮助，你需要将你的问题缩小到一个单一的、可解决的问题。也许会有一些帮助。@NullPointer更像是居中。不是真的。看看这个：-我用的就是这种菜单。但后来出现了某种“全屏”。