- 给标签添加为元素,设置content/宽/高
- 子绝父相做好定位
- 添加渐变属性
.container ul li::after {
content: '';
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.5));
opacity: 0;
transition: all 1s;
}
.container ul li:hover::after {
opacity: 1;
}