Javascript T 位置：相对位置； } .菜单列表李a{ 背景色：#cc9efd； 颜色：#fff； 显示：块； 字体大小：16px； 线高：35px； 填充：5px20px； 文字装饰：无； } .菜单列表li：悬停>a{ 背景：#fff； 颜色：#cc9efd； } .菜单列表li：悬停ul.subs{ 高度：自动； 宽度：180px； } .菜单列表{ 不透明度：0； 宽度：100%； } .菜单列表li：悬停ul li{ 不透明度：1； } .菜单列表ul li a{ 背景：#fff； 颜色：#cc9efd； 线高：1px； } .菜单列表li：将鼠标悬停在ul li a上{ 线高：35px； } .菜单列表李a：悬停{ 背景#f2f4； } .菜单列表li ul li a:悬停{ 背景#f2f4； } /*汉堡包*/ .汉堡包{ 显示：无； 背景色：透明； 边界：0； 颜色：#fff； 光标：指针； 字体大小：20px； } .汉堡：聚焦{ 大纲：无； } /*社交头像*/ .右标题a{ 显示：内联块； 宽度：35px； 高度：35px； 边界半径：5px； 字体大小：20px； 颜色：#ffffff； 文本对齐：居中； 线高：35px； 左边距：10px； 利润上限：3倍； } .标题右侧a：第一个孩子{ 左边距：0； } .右标题.fa{ 利润上限：3倍； } /*媒体查询*/ /*汉堡包*/ @媒体屏幕和屏幕（最大宽度：1024px）{ .汉堡包{ /*位置：绝对位置*/ 显示：内联块； 右：0； 右边距：5px； } .菜单{ 宽度：100% } .菜单列表{ 显示：无； } .菜单列表李{ 浮动：无 } .菜单列表li：悬停ul.subs{ z指数：1； 宽度：100%； 位置：未设置； } .menu-list.show{ 显示：块； } .展示{ 背景：#000！重要； } .右标题{ 显示：无； } } 洛勒姆

我在

@媒体屏幕和（最大宽度：1024px）

中添加了一些代码，比如

。菜单列表li:hover-ul.subs

，

。菜单

，并从

汉堡包

中删除

位置：绝对

。希望这能解决你的问题

const hamburger=document.getElementById（'hamburger'）；
const menuUL=document.getElementById（'menu-list'）；
hamburger.addEventListener（'click'，（）=>{
menuUL.classList.toggle（'show'）；
});
*概述*/
html，正文{
框大小：边框框；
保证金：0；
填充：0；
}
*，*：之前，*：之后{
框大小：继承；
}
/* * {
外形：2倍纯红；
} */
身体{
字体系列：“蒙特塞拉特”，无衬线；
字体大小：100%；
宽度：100%；
}
img{
最大宽度：100%；
高度：自动；
}
.小组：之前，
.小组：之后{
内容：“；
显示：表格；
}
.小组：之后{
明确：两者皆有；
}
.集装箱{
位置：相对位置；
右边距：自动；
左边距：自动；
左侧填充：15px；
右侧填充：15px；
}
/*导航栏*/
navbar先生{
边界：无；
字体大小：1.1428571428571428em；
z指数：1000；
背景色：#cc9efd；
}
navbar先生{
位置：相对位置；
保证金：0；
填充：0；
边框：1px实心透明；
}
.导航栏.标志位置{
显示：内联块；
字号：200；
字体大小：25px；
颜色：#fff；
}
.地盘名称a{
文字装饰：无；
颜色：#fff；
}
/*下拉菜单*/
.菜单列表，.菜单列表{
列表样式：无；
保证金：0；
填充：0；
}
.菜单列表{
身高：0；
左：0；
溢出：隐藏；
位置：绝对位置；
}
.菜单列表李{
浮动：左；
位置：相对位置；
}
.菜单列表李a{
背景色：#cc9efd；
颜色：#fff；
显示：块；
字体大小：16px；
线高：35px；
填充：5px20px；
文字装饰：无；
}
.菜单列表li：悬停>a{
背景：#fff；
颜色：#cc9efd；
}
.菜单列表li：悬停ul.subs{
高度：自动；
宽度：180px；
}
.菜单列表{
不透明度：0；
宽度：100%；
}
.菜单列表li：悬停ul li{
不透明度：1；
}
.菜单列表ul li a{
背景：#fff；
颜色：#cc9efd；
线高：1px；
}
.菜单列表li：将鼠标悬停在ul li a上{
线高：35px；
}
.菜单列表李a：悬停{
背景#f2f4；
}
.菜单列表li ul li a:悬停{
背景#f2f4；
}
/*汉堡包*/
.汉堡包{
显示：无；
背景色：透明；
边界：0；
颜色：#fff；
光标：指针；
字体大小：20px；
}
.汉堡：聚焦{
大纲：无；
}
/*社交头像*/
.右标题a{
显示：内联块；
宽度：35px；
高度：35px；
边界半径：5px；
字体大小：20px；
颜色：#ffffff；
文本对齐：居中；
线高：35px；
左边距：10px；
利润上限：3倍；
}
.标题右侧a：第一个孩子{
左边距：0；
}
.右标题.fa{
利润上限：3倍；
}
/*媒体查询*/
/*汉堡包*/
@媒体屏幕和屏幕（最大宽度：1024px）{
.汉堡包{
/*位置：绝对位置*/
显示：内联块；
右：0；
右边距：5px；
}
.菜单{
宽度：100%
}
.菜单列表{
显示：无；
}
.菜单列表李{
浮动：无
}
.菜单列表li:悬停