0

我不是 CSS 专家，所以我可能会遗漏一些明显的东西。我正在尝试设置相对大小的页眉和页脚（以便在较大的显示器上，页眉和页脚比在较小的屏幕上大）。为此，我使用百分比高度。但是，这仅在我将 设置为 时才position有效absolute。问题是，将其设置为绝对意味着它与屏幕的主要部分重叠（在页眉和页脚之间）。将其设置为相对不起作用，因为它依赖于页眉/页脚内的项目。这是我的标题的样子：

.header
{
    position:absolute;
    top:0px;
    background-color:white;
    width:100%;

    height:30%;

}

ASPX 页面只包含

<div class="header"></div>

有没有办法获得相对比例的页眉和页脚？

谢谢

4

2 回答 2

1

要使用百分比高度，父级需要有一个固定高度，因为如果父级是自动高度，那么它将取决于子级内容的高度......这取决于父级高度等。我认为当你设置位置时要绝对，它将屏幕视口作为具有固定大小的父元素（我的理论），这就是它与绝对值一起使用的原因。

我认为尝试根据浏览器分辨率进行比例页眉和页脚并不是一个好主意。老实说，这对我来说真的没有多大意义，你将需要尝试放大和缩小标题中的字体大小或图像以匹配等。如果你真的想要我建议使用不同的 CSS用户可以选择的样式表（或由 javascript 自动选择）。这样，如果有人有很大的分辨率，他们可以根据需要选择更大的分辨率（或自动为他们选择）。这样您就不必处理任何缩放问题。

于 2010-05-05T18:54:01.460 回答
1

为了让元素采用百分比高度，您需要定义 HTML 和 BODY 以具有定义的高度。因为你不知道这是什么，所以使用 100%。

html, body {
    height:100%;
}
于 2010-05-05T18:58:44.297 回答