javascript - CSS 固定 header 顶部 :0;

Question

在一个网站上工作，我正在努力让它成为 <header></header>和导航保留在网站的顶部。我能够解决一些我似乎无法解决的问题。

我使用的代码是:

header {
    background:#000;
    position:fixed;
    width: 100%;
    top: 0;
}

现在，一旦我将此代码放入，<header> 中的每件事都会失败或失败。标签落在 '' 下方，并且还在下方滚动并穿过它，就好像穿过它一样。我想知道是否有办法让网站的其余部分位于“”下方或滚动而不进入或穿过 <header> ？

我试过给 <header> <margin-bottom>创建空间，以便在网站首次加载时可以看到文本，但这似乎行不通。

有任何解决方案的链接吗？

Answer 1

只需在页眉上放置一些高度，在主体上放置一些边距即可。

header {
    background:#000;
    position:fixed;
    width: 100%;
    top: 0;
    height: 60px;
}

body {
    margin-top: 60px
}