css - 窗口缩小时CSS上边距缩小

Question

当窗口最大化时，我希望我的网页的上边距为 100px，但如果用户调整窗口大小以缩小它，我希望这个边距缩小。边距的最小尺寸应该是 10 像素，并且应该与窗口高度成比例地缩小。

一个例子，如果我试图模仿的是http://www.bing.com/

我将如何在 CSS 中实现这一点？我现在正在纠结min-height,min-width和。heightwidth

谢谢。

score 2 · Accepted Answer

没有看到一些代码，很难给出一个很好的建议。但是，您可以将 html 和 body 设置为 100% 高度，这实际上应该符合浏览器可视部分的高度：

html, body{ margin:0; padding:0; height:100%; }

从那里，您可以将 div 直接添加到正文中，并为其指定一个百分比的高度：

#push{ height: 15%; }

您的正文 html 看起来像：

<body>
    <div id="push"></div>
    <div>
        asdf asdf
    </div>
</body>

当身体高度发生变化时，推动高度也会发生变化。您可能需要调整该数字以使其符合您的喜好。你也可以给推送一个最小高度，但 IE6 不支持。此外，100% 的 html / body 可能会在以后给您带来麻烦，具体取决于您如何处理页脚和事情，所以要小心并祝您好运。

1 回答 1