Html Can'；t更改导航栏的背景颜色

我无法更改导航栏的背景颜色。我没有使用任何框架，所以没有冲突。以下是我尝试过的代码：

。导航权限{
浮动：对；
}
.导航左{
浮动：左；
}
.主导航{
背景色：#000；
宽度：100%；
}
.导航主李{
显示：内联块；
填充：10px；
}
.主导航a{
颜色：#F2F2；
文字装饰：无；
}

在浮动元素的父元素中缺少一个溢出：隐藏。没有它，浏览器无法计算高度，因此背景颜色无法通过。尝试将此行添加到CSS：

.navigation-main{
    background-color: #000;
    width: 100%;
    overflow: hidden; // Add this
}

---

在浮动元素的父元素中缺少一个溢出：hidden。没有它，浏览器无法计算高度，因此背景颜色无法通过。尝试将此行添加到CSS：

.navigation-main{
    background-color: #000;
    width: 100%;
    overflow: hidden; // Add this
}

---

刚刚更正了您的HTML并添加了溢出：隐藏到您的

。导航主{…}

---

Teknotica也有：）

刚刚更正了你的HTML并添加了溢出：隐藏到你的

.navigation main{…}

Teknotica也有：）

你必须清理你的浮动。使用

溢出

是一种偷偷摸摸的方法，但并不总是可取的方法。在我看来，最好的方法是使用伪元素，如下所示：

/*清除*/
ul:之后{
内容：“；
显示：表格；
明确：两者皆有；
}
.航行权{
浮动：对；
}
.导航左{
浮动：左；
}
.主导航{
背景色：#000；
宽度：100%；
}
.导航主李{
显示：内联块；
填充：10px；
}
.主导航a{
颜色：#F2F2；
文字装饰：无；
}

您必须清除浮动。使用

溢出

是一种偷偷摸摸的方法，但并不总是可取的方法。在我看来，最好的方法是使用伪元素，如下所示：

/*清除*/
ul:之后{
内容：“；
显示：表格；
明确：两者皆有；
}
.航行权{
浮动：对；
}
.导航左{
浮动：左；
}
.主导航{
背景色：#000；
宽度：100%；
}
.导航主李{
显示：内联块；
填充：10px；
}
.主导航a{
颜色：#F2F2；
文字装饰：无；
}

注意：您的标记无效，只有

li

可以是

ul/ol

的直接子级。注意：您的标记无效，只有

li

可以是

ul/ol

的直接子级。感谢您的帮助，您已经解决了我的问题：DGlad来帮忙！请进行表决；-）@Teknotica+1，尽管我知道高度是个问题，但我不知道溢出：隐藏可以解决这个问题，但是

溢出：hidden

确保子元素的扩展不超过父元素的高度；在这里，我们没有指定任何高度，所以浏览器不应该出现一些错误，或者只是假设高度为零？？即使这样做有效，这也不是清除浮动的最佳方法！这是一种非常有名的清除浮动的方法。我从未说过它是“最好的”，但我个人一直在使用它，没有任何问题。这里有一篇很好的文章解释了不同的清除浮动的方法谢谢你的帮助，你已经解决了我的问题DGlad来帮忙！请进行表决；-）@Teknotica+1，尽管我知道高度是个问题，但我不知道溢出：隐藏可以解决这个问题，但是

溢出：hidden

确保子元素的扩展不超过父元素的高度；在这里，我们没有指定任何高度，所以浏览器不应该出现一些错误，或者只是假设高度为零？？即使这样做有效，这也不是清除浮动的最佳方法！这是一种非常有名的清除浮动的方法。我从未说过它是“最好的”，但我个人一直在使用它，没有任何问题。这里有一篇很好的文章，解释了清算浮动的不同方式