Html 使用子链接时保持父链接悬停

我有这个下拉菜单设置，我遇到了麻烦。只要我使用子菜单，父链接就需要处于悬停状态

/*下拉按钮*/
.dropbtn{
背景色：透明；
颜色：#585558；
填充：16px；
字号：1em；
边界：无；
光标：指针；
字体大小：粗体；
}
/*容器-需要定位下拉内容*/
.下拉列表{
位置：相对位置；
显示：内联块；
}
/*下拉内容（默认情况下隐藏）*/
.下拉内容{
显示：无；
位置：绝对位置；
最小宽度：160px；
z指数：1；
衬垫顶部：-16px；
}
/*下拉列表中的链接*/
.下拉内容a{
颜色：#585558；
填充：6px 16px；
文字装饰：无；
显示：块；
字体大小：粗体；
}
.fb:悬停{
颜色：#3b5998；
}
.ig:悬停{
颜色：#fb3958；
}
.sc:悬停{
颜色：#fffc00；
}
/*悬停时显示下拉菜单*/
.下拉：悬停.下拉内容{
显示：块；
}
.dropbtn:悬停>a{
颜色：#ef5350；
}
.反斜杠{
颜色：#8e8e8e；
字体大小：粗体；
}

社会中介

您只需添加

：hover

状态

.dropdown:hover .dropbtn {
  background: aqua;
}

/*下拉按钮*/
.dropbtn{
背景色：透明；
颜色：#585558；
填充：16px；
字号：1em；
边界：无；
光标：指针；
字体大小：粗体；
}
/*容器-需要定位下拉内容*/
.下拉列表{
位置：相对位置；
显示：内联块；
}
.dropdown:悬停.dropbtn{
背景：水；
}
/*下拉内容（默认情况下隐藏）*/
.下拉内容{
显示：无；
位置：绝对位置；
最小宽度：160px；
z指数：1；
衬垫顶部：-16px；
}
/*下拉列表中的链接*/
.下拉内容a{
颜色：#585558；
填充：6px 16px；
文字装饰：无；
显示：块；
字体大小：粗体；
}
.fb:悬停{
颜色：#3b5998；
}
.ig:悬停{
颜色：#fb3958；
}
.sc:悬停{
颜色：#fffc00；
}
/*悬停时显示下拉菜单*/
.下拉：悬停.下拉内容{
显示：块；
}
.dropbtn:悬停>a{
颜色：#ef5350；
}
.反斜杠{
颜色：#8e8e8e；
字体大小：粗体；
}

社会中介