如何在html/css中创建一个与页面其余部分没有空间的导航栏？

我正在创建一个网站作为一个公文包来展示我的路径，但我的问题是，我的导航栏本身和页面的其余部分之间有一个空间

我试过使用边框、边距和宽度，但都不起作用

正文{
背景色：#B31854；
}
保险商实验室{
列表样式类型：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#900C3F；
}
李{
浮动：左；
}
李阿{
显示：块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
李娜：停下来{
背景色：#740A33；
}
h1{
字体系列：Schluber；
颜色：#D7BDE2；
}
p{
颜色：#D7BDE2；
宽度：300px；
保证金：自动；
}

孟河畔的Bienvenue公文包！

我想您是想删除正文的默认边距。尝试使用以下命令重置它：

body {margin:0;}

将规则添加到css的顶部

演示：

正文{
边距：0；/*此处发生重置*/
背景色：#B31854；
}
保险商实验室{
列表样式类型：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#900C3F；
}
李{
浮动：左；
}
李阿{
显示：块；
颜色：白色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
}
李娜：停下来{
背景色：#740A33；
}
h1{
字体系列：Schluber；
颜色：#D7BDE2；
}
p{
颜色：#D7BDE2；
宽度：300px；
保证金：自动；
}

孟河畔的Bienvenue公文包！

尝试以下代码：

body {
        background-color : #B31854;
    }


ul {
  list-style-type: none;
  overflow: hidden;
  background-color: #900C3F;
}

li {
 position:relative;
 float:left;
 left: 25%;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover {
  background-color: #740A33;
}


h1 {
    font-family : Schluber;
    color : #D7BDE2 ;
}
p {
color : #D7BDE2 ;
width:300px;
margin : auto;
}

---

我给你的导航加了边距。请在您的样式中查看ul类。我给了一个

页边距top-10

，因此它只增加了10个像素，与

页边距left

相同

body{
    width: 100%;
}

    ul {
    margin-top: -10px;
    margin-left: -10px;

  list-style-type: none;
  overflow: hidden;
  background-color: #900C3F;
    }

li {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover {
  background-color: #740A33;
}


h1 {
    font-family : Schluber;
    color : #D7BDE2 ;
}
p {
color : #D7BDE2 ;
width:300px;

}

---

欢迎光临：）

请解释原帖中的错误以及您的解决方案是如何解决问题的。我为您的导航添加了边距，#在您的样式中查看ul类。给了一个页边距top-10，所以它只上升了10像素，与页边距相同-left@RemyBaas请不要那样做。检查。不要与浏览器对抗；重置它。@aloisdg是的，可以，但是如果你想在页面的其他地方使用边距，那么它就不起作用了，因为他总是要重置it@RemyBaas如果你想在某个地方获得利润，就用利润吧。CSS就是为这个场景而构建的。