Html 为什么'；我的UL背景色是否包含LI元素？

在我的

上设置背景时，

背景色

不会覆盖其

子元素（它们的

背景

不会更改）。如果我为

我希望
元素具有与顶部菜单相同的
背景色

我做错了什么


*{
填充：0；
保证金：0；
框大小：边框框；
背景色：#546a76；
}
.网页内容{
显示：网格；
网格模板行：8fr 8fr 1fr；
}
.顶部标题{
显示：网格；
网格模板行：.5fr 7fr；
高度：100vh；
}
.顶级菜单列表{
显示器：flex；
弯曲方向：行；
列表样式类型：无；
填充：1rem；
证明内容：柔性端；
背景色：#37454d；
}
.顶部菜单列表a{
文字装饰：无；
字体大小：150%；
}






您正在为*元素设置背景色，该元素将该背景色应用于页面上的每个元素。因此，即使将不同的背景色应用于ul元素，li的背景色仍将与在*元素中设置的相同。从*中删除背景色，并在需要时将其应用于其他位置。
您正在将背景色设置为*元素，这将背景色应用于页面上的每个元素。因此，即使将不同的背景色应用于ul元素，li的背景色仍将与在*元素中设置的相同。如果需要，请从*中删除背景色，并将其应用到其他位置。
您不应在星号
*
通用选择器上使用
背景色。它将设置每个尚未设置背景色的元素的背景色

要达到预期效果，请改为设置
.page content
主体元素的背景色


*{
填充：0；
保证金：0；
框大小：边框框；
}
.网页内容{
显示：网格；
网格模板行：8fr 8fr 1fr；
背景色：#546a76；
}
.顶部标题{
显示：网格；
网格模板行：.5fr 7fr；
高度：100vh；
}
.顶级菜单列表{
显示器：flex；
弯曲方向：行；
列表样式类型：无；
填充：1rem；
证明内容：柔性端；
背景色：#37454d；
}
.顶部菜单列表a{
文字装饰：无；
字体大小：150%；
}






您不应该在星号
*
通用选择器上使用
背景色。它将设置每个尚未设置背景色的元素的背景色

要达到预期效果，请改为设置
.page content
主体元素的背景色


*{
填充：0；
保证金：0；
框大小：边框框；
}
.网页内容{
显示：网格；
网格模板行：8fr 8fr 1fr；
背景色：#546a76；
}
.顶部标题{
显示：网格；
网格模板行：.5fr 7fr；
高度：100vh；
}
.顶级菜单列表{
显示器：flex；
弯曲方向：行；
列表样式类型：无；
填充：1rem；
证明内容：柔性端；
背景色：#37454d；
}
.顶部菜单列表a{
文字装饰：无；
字体大小：150%；
}