overflow：hidden使它阻止级别元素吗？

Question

enter image description here您好我正在尝试制作水平导航栏。enter image description here 对于ul我已经把溢出：隐藏。 对于我，我放了浮动：左。 我在水平导航栏下面有一些段落。

当我删除“溢出：隐藏”时，段落将向右移动到水平导航栏旁边。 我不懂为什么。 有人可以请你解释一下吗？

Answer 1

没有。 从不使用overflow:hidden navigation上的overflow:hidden可隐藏您需要显示的元素。所以除非你真的需要它，否则不要使用它。

但在这种情况下你没有

请参阅此处：jsfiddle

在段落上使用clear:left 代码：

li { 
  float:left;
  padding:10px
}
ul { 
 float:left;
 list-style:none;
 background:grey;
 width:auto;
}
p { 
 clear:left;
 float:left;
 width:100px
}

或在float:left;width:100%（导航列表）

上使用ul

请参阅此处jsfiddle

代码：

li { 
  float:left;
  padding:10px
}
ul { 
 float:left;
 list-style:none;
 background:grey;
 width:100%;
}
p { 

 float:left;
 width:100px
}

Answer 2

overflow: hidden;用于清除li标签上的浮动。如果没有它，那么段落会在列表旁边显示，因为li是浮动的。