1、给每个缩略图设置不同的图片
提示：使用伪结构选择器:nth-of-type()，并且配合::after
2、给每个缩略图添加透明度蒙板效果
提示：使用伪类选择器::before给缩略图添加蒙板效果
3、鼠标悬浮在缩略图上时，修改缩略图上蒙板的透明度
提示：通过:hover和::before配合修改opacity的值为0
4、点击缩略图，切换背景图片
提示：通过目标选择器:target进行背景图片的切换
5、控制不是被点击图片的层级大小，让其不显示
提示：通过“否定选择器:not()”和“目标选择器:target”来控制不是被切换的背景图像不显示
关于:before和:after的问题，以前我都不知道有这个东西。看了之后才知道原来都可以用after和before在原有的基础之上向前和向后插入对象。这个题目是一样的道理的呀！用after来插入缩略图并给出对于li的绝对定位，用before来添加一个形状和after一样大小的透明块，用绝对定位使其位置和after的位置一致以达到蒙版的效果，再通过hover来改变透明度。通过target来切换背景图。