Question

我正在尝试在CSS中使用.page以延伸到页面的末尾。而不是屏幕的结尾，而是HTML页面上的信息结束的地方。我该怎么做？我对.page的当前配置是：

.page{
  width: 800px;
  height: 550px;
  margin: 0px auto;
  background: #FCFCFA;
  margin-top: -5px;
}

我将如何实现这一目标。我有几个页面使用它，它们的长度不一样，所以我想动态调整。如果这有助于提供#main1和.sideright信息。如果我需要发布任何其他信息，我会很乐意发布。

HTML：http://pastebin.com/1MZt1as4
第二页：http://pastebin.com/CCDFe9B3
CSS：http://pastebin.com/BSLDjc4D

Answer 1

这样做。

html {

    min-height: 100%;
}
body {
    padding:0px;
    margin:0px;

    height: 100%;
}
div.container {

    min-height: 100%;
}

您的代码：

html{
    min-height: 100%;
}
body{
    background-image:url('../Pictures/Background.png');
    background-repeat:repeat-x;
    background-color:#AEAEAE;
    font-family: Verdana;
    padding:0px;
    margin:0px;
    height: 100%;
}

你在高处有一个后退：身体100％

//你希望这些.page和.pageout能扩展多久？你有指定的高度。如果您希望它们扩展页面的整个长度，您需要将高度设置为

min-height: 100%;

// ===================

.page{
    width: 800px;
    height: 550px;
    margin: 0px auto;
    background: #FCFCFA;
    margin-top: -5px;
}
.pageout{
    width: 810px;
    height: 555px;
    margin: 0px auto;

    background: #C0CACF
}

Answer 2

如果您希望.page获取父元素的高度，则父元素也必须具有高度。如果父元素没有高度，则将高度设置为100%将没有任何意义。

Offtopic，但可能对您有所帮助：根据我的经验，你唯一需要高度的是（我猜）设置背景颜色。解决方案：将bg-color或图像切片设置为占据.page元素区域的一些父元素。

CSS <div>没有向下扩展整个页面</div>

2 个答案: