导航栏使用float:left并排排列列表项。但是，不使用float意味着使用display:block？因此，由于块元素是垂直堆叠的，为什么float:left将它们放在一起？另外，from W3C：
在块格式化上下文中，每个框的左外边缘触及包含块的左边缘（从右到左格式化，右边缘触摸）。 即使存在浮动也是如此（尽管盒子的线框可能会因浮动而缩小），除非盒子建立新的块格式化上下文（在这种情况下盒子本身可能变得更窄）到花车）。
（强调我的）
这是不是意味着每个元素都应该垂直堆叠，如果它是一个块，无论如何？
答案 0 :(得分：1)
稍后在规范中，您有section on floats，您可以在其中找到：
＆＃34;浮动框向左或向右移动直到其外边缘 触摸包含块边缘或另一个浮动的外边缘。 如果有线框，则浮动框的外部顶部对齐 在当前行框的顶部。
如果浮子没有足够的水平空间，则移动 向下，直到它适合或没有更多的浮标存在。
由于浮动不在流中，因此创建了未定位的块框 在浮动箱垂直流动之前和之后，好像浮子没有 存在。但是，旁边创建的当前和后续行框 必要时缩短浮子以为边缘盒腾出空间 浮动。＆＃34;
注意＆＃34;因为浮动不在流程中＃34;这意味着浮点数不会在块格式化上下文中作为块布局。浮动按照自己的规则布局，不会影响流中的块元素（但会影响块内的文本流）。
如果浮动元素后跟非浮动元素，则浮动元素将放置在左侧或右侧，然后非浮动元素将作为块放置，就好像浮动元素不存在一样。
向左和向右浮动的两个元素，后跟非浮动元素：
<div class="a"></div>
<div class="b"></div>
<div class="c">text</div>
CSS：
.a { float: left; background: red; width: 50px; height: 50px; }
.b { float: right; background: green; width: 50px; height: 50px; }
.c { background: yellow; height: 100px; }
浮动元素将最终位于非浮动元素的顶部，但其中的文本将围绕浮动元素流动：
+------+--------------------------------------+------+
| |text | |
| | | |
| | | |
+------+ +------+
| |
| |
| |
+----------------------------------------------------+