如何设置窗口大小的上限？

Question

我想div在当前窗口之后放置一个CSS(即当你开始滚动时看到它).

这似乎微不足道,我试过

#content {
    margin-top: 100%;
}

的jsfiddle

但它不起作用,边距不会占据当前窗口的高度.

Answer 1

方案:

1. 您可以使用position:absolute;和FIDDLE实现您的目标top:100%;
   
2. 第二个选项是添加一个元素以height:100%;" .content向下" 向下
   FIDDLE

说明:

问题是百分比margin-top(如margin-bottom或padding-top/bottom)是根据父母的宽度计算的.看到这里

百分比是指包含块的宽度

CSS:

body,html {
    background-color: lightblue;
    height:100%;
    width:100%;
    margin:0;
}

#content {
    position:absolute;
    top: 100%;
    background-color: lightgrey;
}

代码选项2:

HTML:

<div id="push"></div>
<div id="content">
    <p>... content ...</p>
</div>

CSS:

body,html {
    background-color: lightblue;
    height:100%;
    width:100%;
    margin:0;
}
#push{
    height:100%;
}

#content {
    background-color: lightgrey;
}