Javascript CSS边距：0自动不在li上工作>；A. 我想要一个导航栏，它的元素（LI>A）在中间。 我只实现了浮动左风格

#包装器{
宽度：900px；
保证金：0自动；
}
李{
浮动：左；
}
ul>li>a{
显示：块；
填充：14px 16px；
颜色：#fff；
文本对齐：居中；
文字装饰：无；
保证金：0自动；
字体：18px不可分割；
}
/*FDF*/
保险商实验室{
列表样式：无；
保证金：0；
填充：0；
溢出：隐藏；
背景色：#333；
边界半径：20px；
}
李：悬停{
背景：#111；
}
李>a{
背景色：#4CAF50；
颜色：#fff；
}

您需要使

li

成为一个内联元素，它的父元素应该通过

text align:center

使其居中。像这样：

#wrapper{
width:900px;
margin:0 auto;
text-align:center;
}

li {
  display:inline-block;
}

udpate

---

您会注意到这些

li

项之间有一个空格。为了摆脱它们，以一种将这些标记粘在一起的方式构造HTML。例如：

在
a
上的边距起作用，但由于li具有
浮动：左
，它的行为就像自动宽度一样

如果您确定只有2个菜单项，则可以从li中删除
float:left
，并仅向第一个li添加float

ul li:first-child{
      float: left;
}


或者将
宽度：50%
添加到
li

li{
  float:left;
  width:50%
}

但最后一件事，为什么它不悬停在填充的整个背景区域？我的意思是在使用class.activeWell之前，悬停和元素之间有一点空间，这是因为它是一个内联块。因此，将显示“
”标记之间的空间。只要把这些标签“粘”在一起，它就会消失