为何无法修改navBar div的背景颜色？求问题成因解析

你的#navBar设置黑色背景却看不到，核心原因是浮动元素导致父容器高度塌陷：

• 你给导航栏里的#liL和.liR都加了float属性，浮动元素会脱离正常文档流，不会撑开父容器#navBar的高度。这就导致#navBar的高度变成了0——就算设置了背景色，也因为没有高度而无法显示。
• 你提到reset.css放在CSS片段底部，但从HTML的引入顺序看，先加载reset.css再加载main.css是正确的（main.css的样式会覆盖reset的默认样式），所以这个不是背景色不显示的原因。

快速验证方法 #

你可以临时给#navBar设置固定高度，比如：

#navBar {
  background-color: black;
  height: 120px;
}

此时黑色背景会正常显示，这就能确认是高度塌陷导致的问题。

内容的提问来源于stack exchange，提问作者nickg