Html 下拉子li背景中的父ul颜色

在这段代码中（练习css下拉菜单），主父级ul的背景色是红色，而下拉子级li“Sub”的背景色是紫色。现在，当我试图将下拉子项li“Sub”20px从其位置向右移动时，我看到背景色红色仍然出现。你可以看到这一点，如果你把鼠标悬停在“你好”我不想要那个。这就像是从占位符中移动出来的东西，留下了原始的占位符颜色。如果我将下拉子项li“Sub”从其原始位置移动到左/右/上/下，则不需要背景色

html正文{
身高：100%；
宽度：100%；
左：0px；
顶部：0px；
边际上限：0px；
左边距：0px；
}
.圆边{
边界半径：5px
}
.集装箱{
利润率最高：5%；
保证金权利：10%；
边缘底部：0px；
左边距：10%；
宽度：自动；
背景色：rgba（153204,0,1）；
高度：25px；
位置：相对位置；
左：0px；
/*[禁用]顶部：0px*/
}
保险商实验室{
文本对齐：居中；
/*[禁用]边框：薄实心rgba（0,0,0,1）*/
宽度：100%；
边际上限：0；
右边距：自动；
边缘底部：0px；
左边缘：0%；
填充顶部：0；
右边填充：0px；
填充底部：0；
左侧填充：0px；
背景色：rgba（255,0,0,1）；
高度：25px；
位置：绝对位置；
}
李{
显示：内联块；
/*[禁用]边框：1px纯黑色*/
/*[禁用]填充：5px*/
高度：25px；
宽度：40px；
页边顶部：自动；
右边距：30px；
页边距底部：自动；
左边距：30px；
位置：相对位置；
背景色：rgba（0,0255,1）；
}
ul>li>ul{
左侧填充：0px；
宽度：100%；
高度：自动；
可见性：隐藏；
位置：绝对位置；
左：0px；
最高：100%；
文本对齐：居中；
/*[禁用]背景色：rgba（255255,1）*/
边际上限：0px；
边缘底部：0px；
左边距：0px；
边框样式：无；
}
ul>li>ul>li{
显示：块；
列表样式类型：无；
宽度：40px；
左边距：自动；
右边距：自动；
位置：相对位置；
边框：1px实心rgba（0255102,1）；
左：20px；
背景色：rgba（204102153,1）；
}
ul li：悬停>ul{
能见度：可见；
}

你好

潜艇


酷
世界

试试这个。这是因为你有

左：20px所以当它悬停时，它正在添加20px；其中包括红色背景


html正文{
身高：100%；
宽度：100%；
左：0px；
顶部：0px；
边际上限：0px；
左边距：0px；
}
.圆边{
边界半径：5px
}
.集装箱{
利润率最高：5%；
保证金权利：10%；
边缘底部：0px；
左边距：10%；
宽度：自动；
背景色：rgba（153204,0,1）；
高度：25px；
位置：相对位置；
左：0px；
/*[禁用]顶部：0px*/
}
保险商实验室{
文本对齐：居中；
/*[禁用]边框：薄实心rgba（0,0,0,1）*/
宽度：100%；
边际上限：0；
右边距：自动；
边缘底部：0px；
左边缘：0%；
填充顶部：0；
右边填充：0px；
填充底部：0；
左侧填充：0px；
背景色：rgba（255,0,0,1）；
高度：25px；
位置：绝对位置；
}
李{
显示：内联块；
/*[禁用]边框：1px纯黑色*/
/*[禁用]填充：5px*/
高度：25px；
宽度：40px；
页边顶部：自动；
右边距：30px；
页边距底部：自动；
左边距：30px；
位置：相对位置；
背景色：rgba（0,0255,1）；
}
ul>li>ul{
左侧填充：0px；
宽度：100%；
高度：自动；
可见性：隐藏；
位置：绝对位置；
左：0px；
最高：100%；
文本对齐：居中；
/*[禁用]背景色：rgba（255255,1）*/
边际上限：0px；
边缘底部：0px；
左边距：0px；
边框样式：无；
}
ul>li>ul>li{
显示：块；
列表样式类型：无；
宽度：40px；
左边距：自动；
右边距：自动；
位置：相对位置；
边框：1px实心rgba（0255102,1）；
背景色：rgba（204102153,1）；
}
ul li：悬停>ul{
能见度：可见；
}


你好

潜艇


酷
世界

您需要将
ul>li>ul{
设置为
背景：透明；
因为它当前从
ul{
获取
背景：红色；


html正文{
身高：100%；
宽度：100%；
左：0px；
顶部：0px；
边际上限：0px；
左边距：0px；
}
.圆边{
边界半径：5px
}
.集装箱{
利润率最高：5%；
保证金权利：10%；
边缘底部：0px；
左边距：10%；
宽度：自动；
背景色：rgba（153204,0,1）；
高度：25px；
位置：相对位置；
左：0px；
/*[禁用]顶部：0px*/
}
保险商实验室{
文本对齐：居中；
/*[禁用]边框：薄实心rgba（0,0,0,1）*/
宽度：100%；
边际上限：0；
右边距：自动；
边缘底部：0px；
左边缘：0%；
填充顶部：0；
右边填充：0px；
填充底部：0；
左侧填充：0px；
背景色：rgba（255,0,0,1）；
高度：25px；
位置：绝对位置；
}
李{
显示：内联块；
/*[禁用]边框：1px纯黑色*/
/*[禁用]填充：5px*/
高度：25px；
宽度：40px；
页边顶部：自动；
右边距：30px；
页边距底部：自动；
左边距：30px；
位置：相对位置；
背景色：rgba（0,0255,1）；
}
ul>li>ul{
左侧填充：0px；
宽度：100%；
高度：自动；
可见性：隐藏；
位置：绝对位置；
左：0px；
最高：100%；
文本对齐：居中；
/*[禁用]背景色：rgba（255255,1）*/
边际上限：0px；
边缘底部：0px；
左边距：0px；
边框样式：无；
背景：透明；
}
ul>li>ul>li{
显示：块；
列表样式类型：无；
宽度：40px；
左边距：自动；
右边距：自动；
位置：相对位置；
边框：1px实心rgba（0255102,1）；
左：20px；
背景色：rgba（204102153,1）；
}
ul li：悬停>ul{
能见度：可见；
}


你好

潜艇


酷
世界

我相信他希望它是
左：20px
但他不希望红色在那里