窗口缩小时CSS上边距缩小

Question

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

如果我尝试模仿的示例是http://www.bing.com/

我将如何在CSS中实现呢？ 我现在正在努力处理min-height ， min-width ， height和width 。

谢谢。

Answer 1

如果不看一些代码，就很难给出很好的建议。 但是，您可以将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可能会在以后给您带来麻烦，具体取决于您的页脚和其他方式，因此要当心并祝您好运。