Html 将顶部导航栏扩展到页面的全宽 我想要一个TopBar导航，类似于你看到的一个基础。我遇到的问题是，我已经为页面设置了边距，但不知道如何覆盖它们

因此，对于大多数页面（正文），我需要这些页边距，但对于顶部栏，我希望它扩展浏览器的整个宽度

代码如下：

body {
font-family: 'Droid Sans', sans-serif;
font-size: 1.2em;
color: #000000;
background-color: white;
margin: 0em 6.5em 3.5em;

#nav ul {

width: 100%;
background-color: #212121;
font-size: 12px;
font-weight: bold;
color: white;
text-align: left;
display: block;
margin: 0;
padding: 15px 4px 17px 0;
list-style: none;
}
#nav ul li {
  display: inline-block;
  margin-right: -4px;
  height: inherit;
  margin-left: 20px;
  position: relative;
  padding: 15px 20px;
  background: #212121;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
#nav ul li:hover {
 background: #212121;
  color: #fff;
}
#nav ul li ul {
  padding: 0;
  position: absolute;
  top: 48px;
  left: 0;
  width: 150px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
 #nav ul li ul li { 
   background: #212121; 
  display: block; 
  color: #fff;
}
 #nav ul li ul li:hover { background: #212121; }
#nav ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

Html:

家
地点
事件
摊位

食物
工艺美术


接触

使用

fixed

定位页面顶部所需的导航栏

#nav {
    min-width:100%;
    position:fixed;
    top:0;
    left:0;
}

---

添加100%的

minwidth

，应该可以确保导航栏延伸到页面的整个宽度。将

顶部

和

左侧

设置为零，并结合

位置：固定

，将导航div锚定到左上角。

对收割台应用以下css

#nav{
position:absolute;
left:0;
right:0;
}

它将导航从正常流程中移除，并将其从左向右拉伸

检查这个

---

如果设置

位置：固定；宽度：100%然后收割台将从正常流量中取出，并相对于窗口定位。即使用户向下滚动页面，它也会保持在原来的位置。
除了使用绝对定位，您还可以对
#nav
使用负边距，如下所示：

#nav {
  margin-left:-6.5em;
  margin-right:-6.5em;
}

这将设置相对于窗口的标题，即使用户向下滚动，标题也将保持不变。@TilwinJoy，是的，我假设这是询问者想要的导航栏。@DhruvKapoor是的，我不确定他所说的“基础”是什么意思，请编辑你的帖子，以便我可以删除投票。什么是基础？你还没有关闭body的样式规则，这是打字错误吗？
#nav {
  margin-left:-6.5em;
  margin-right:-6.5em;
}