Javascript 在li上添加覆盖图像
问题：当列表项悬停时，我试图使覆盖显示 我不熟悉html，我正在尝试在Javascript 在li上添加覆盖图像,javascript,html,css,web,Javascript,Html,Css,Web,问题：当列表项悬停时，我试图使覆盖显示 我不熟悉html，我正在尝试在列表项悬停上获得分割覆盖。但是，当我只想在列表项上作为类标题以灰色显示时，覆盖显示在屏幕的整个宽度上。 我只想在灰色的列表项上显示红色重叠部分 这是我的密码： *{ 框大小：边框框； } .栏目{ 浮动：左； 宽度：33.3%； 填充：8px； } .价格{ 列表样式类型：无； 边框：1px实心#eee； 保证金：0； 填充：0； -webkit转换：0.3s； 过渡：0.3s； } .覆盖{ 位置：绝对位置； 底部：0；
列表项列表项标题列表项上显示红色重叠部分
这是我的密码：
*{
框大小：边框框；
}
.栏目{
浮动：左；
宽度：33.3%；
填充：8px；
}
.价格{
列表样式类型：无；
边框：1px实心#eee；
保证金：0；
填充：0；
-webkit转换：0.3s；
过渡：0.3s；
}
.覆盖{
位置：绝对位置；
底部：0；
左：0；
右：0；
背景色：#F9423A；
溢出：隐藏；
宽度：100%；
身高：0；
过渡：放松；
}
.价格：悬停{
/*盒影：0 8px 12px 0 rgba（0,0,0,0.2）*/
背景色：#002A3A；
}
。价格：悬停。覆盖{
身高：20%；
}
.价格.标题{
背景色：#ccd4d7；
颜色：#002A3A；
对齐内容：居中对齐；
字体大小：25px；
身高：100%；
}
李先生{
边框底部：1px实心#eee；
填充：20px；
文本对齐：居中；
}
- li一
李一描述
- li一
李二描述
- li三
李三描述
将位置：相对添加到.price.header
。添加position:relative
会使具有position:absolute
的子对象相对于父对象定位。否则，任何带有位置：绝对的元素都会将自身相对于窗口对象进行定位。不清楚。这就是你想要达到的吗？我又检查了一遍，一切正常-