Html 如果使用ID而不是类选择了两个属性的父元素，为什么我不能选择它们？

我有一个nav元素，它有一个名为“menu”的ID，里面有6个“a”元素。我正在尝试使用他们的ID选择其中两个。但它不起作用

但是如果我使用一个类选择nav元素并相应地编辑CSS选择器，那么这个样式就可以完美地工作。那么，为什么它不与ID一起工作，而与类一起工作呢

#菜单{
显示器：flex；
证明内容：柔性端；
对齐项目：居中；
填充：10px；
}
#标志{
右边距：自动；
}
#菜单a{
填充：0 5px；
利润率：0.10px；
}
#汉堡包{
显示：无；
光标：指针；
填充物：5px；
}
梅努巴先生{
宽度：30px；
高度：5px；
背景色：黑色；
保证金：5px0；
}
a{
文字装饰：无；
颜色：黑色；
}
@媒体屏幕和屏幕（最大宽度：992px）{
#汉堡包{
显示：块
}
#菜单a：不是（[id=logo]）{
显示：无
}
}

这是一个问题。你的

#菜单一个

选择器击败了你的

#汉堡

和

#徽标

选择器。通常，

#id标记

选择器总是比

#id

选择器更具体。要使后一个选择器更具体，您还可以使用

#菜单

预先设置它们，如下所示：

#菜单{
显示器：flex；
证明内容：柔性端；
对齐项目：居中；
填充：10px；
}
#标志{
右边距：自动；
}
#菜单a{
填充：0 5px；
利润率：0.10px；
}
#汉堡包{
显示：无；
光标：指针；
填充物：5px；
}
梅努巴先生{
宽度：30px；
高度：5px；
背景色：黑色；
保证金：5px0；
}
a{
文字装饰：无；
颜色：黑色；
}
@媒体屏幕和屏幕（最大宽度：992px）{
#菜单a{
显示：无
}
#菜单#汉堡包{
显示：块
}
#菜单#标识{
显示：块
}
}