html中怎么使竖导航栏不重叠,如何阻止我的主体与HTML/CSS中的导航栏和横幅重叠...-CSDN博客

我目前正在设计一个网站，并且在导航栏和标题中遇到了一些问题。我已经对CSS进行了编码，以便导航栏和横幅图像在滚动时保留在页面的顶部。如何阻止我的主体与HTML/CSS中的导航栏和横幅重叠

这是成功的，但是身体的文字会通过导航栏。我已经在导航栏上设置了所有边距和填充。有没有一种方法可以设置它，以便横幅，导航栏和主体都作为一个整体进行跟踪？正文文本显然是一个例子，显然页面链接还没有填写等。

要看到发生了什么的例子。去这里：www.jamiewebguy.com

HTML代码：

Jamie. The Web Guy

Home
What?
Pricing
Contact Us
Testimonials
About

CSS代码：

header {

position:fixed;

top: 0;

width: 100%;

}

ul {

position: fixed;

width: 100%;

list-style-type: none;

margin: 0;

padding: 0;

text-align: center;

background-color: #f3f3f3;

border: 1px solid #e7e7e7;

}

a {

display: inline-block;

width: 80px;

text-align: center;

}

li {

width: 100px;

margin: auto;

display: inline;

border-right: 1px solid #bbb;

}

li:last-child {

}

li a

{

display: inline-block;

color: #666;

text-align: center;

padding: 14px 16px;

text-decoration: none;

}

li a:hover

{

background-color: #111;

}

.active

{

background-color: #4CAF50;

}

#main-content

{

margin: 300px 0 0 0;

}

2017-09-03

JamWill