html - 文本位于 html/css 中的标题下方

Question

我正在使用 html 和 php 开发一个网站。我已经为主页创建了一个固定的标题，其中的链接借助内部链接指向页面的不同部分。 但是，当我这样做时，文本位于标题下方，例如:如果我正在使用关于页面，当我单击关于链接时，它会将我带到关于内容，但链接词(在本例中为关于)位于标题。

请建议一些代码来解决这个问题。

Answer 1

http://jsfiddle.net/5zNcQ/9/

您在顶部添加垂直空间，将主容器向下推。这个空间应该至少是固定容器的高度。

header {
    position: fixed;
    left: 0;
    top: 0;
    height: 100px;
    width: 100%;
    background: red;
}
header ul li {
    display: inline;
}
main {
    padding-top: 120px;
}
main p {
    margin: 20px 0 0 0;
}
main p:first-child {
    margin:0;
}