是否有处理浏览器大小调整的最佳实践？答案

【问题标题】：Is there a best practice for handling browser resizing?是否有处理浏览器大小调整的最佳实践？
【发布时间】：2011-03-23 20:36:48
【问题描述】：

我觉得 GMail 是最佳实践的一个很好的例子，但我正在寻找一种更加理论化的基于代码的方法。 CSS？ JavaScript？ jQuery？让我们听听。

【问题讨论】：

【解决方案1】：

取决于您在调整窗口大小时必须执行的操作...

通常大多数应用程序和网站使用浏览器调整大小事件来更改布局或在用户更改浏览器窗口大小时增加/减小字体大小。

【讨论】：

嗯。绝大多数网站没有对浏览器调整大小事件做任何特别的事情。在我的脑海中，我只能想到一个网站（那是因为它有两种布局，不是为桌面浏览器设计的，并且在事后添加了调整大小的技巧以使事情变得更好一点对于尝试使用桌面浏览器访问它的用户）

【解决方案2】：

当用户调整浏览器窗口的大小时，大多数 Web 应用程序都使用适当的文档布局和 CSS 来使流程自然而然地工作，而根本不需要执行任何脚本。这正是 CSS 属性 display、position、float、clear 等的用途。

【讨论】：

您能详细说明一下“正确的文档布局”吗？我发现您的回答含糊不清，并没有真正的帮助。
“正确的文档布局”是指：按预期使用结构标记，然后应用 CSS 设置样式。充分利用您必须提供的各种选项，以提供自然适应给定窗口大小和字体的文档。这意味着，除其他外，您应该避免绝对定位，在有意义的情况下以 em 而不是像素指定大小，除非绝对必须，否则不要使用表格进行布局，尽量不要仅出于以下目的而插入结构元素创建视觉效果（尽管这通常是实现您想要的效果的唯一方法）。

【解决方案3】：

你可以做类似this的事情。

这个想法是你制作一个大包装（#main，最轻的一个），然后在里面放置 2 个 div：#left 和 #right。

left 是一个固定宽度的 div width:200px 并向左浮动 float:left。

right 是流动的，所以没有宽度，但是为了防止 #left 重叠，你给 #right 一个宽度为 #left -> margin:0 0 0 200px 的边距。

为了防止#right 太小，您可以给它一个最小宽度min-width:400px。现在，当您调整窗口大小时，#right 将一直调整大小，直到 #right 到达 400px，然后滚动条将可见

【讨论】：