ul下，对不同高度的图片进行遮罩

        在做图片的展示那块的时候，想到平时别的网站上面看见的一些图片的展示，鼠标移上去的时候，会出现一层半透明的罩，然后还会出现字。想着应该挺简单的，就想做一做。先放个成品图（左边是未遮罩的图片，右边是鼠标移上去之后进行遮罩了之后的图片）：

       因为之前有做过类似的，所以没有任何犹豫的做了，结果发现有问题出现了，上面图片这个我是在codepen上写的，就是说要用图片的话，得使用已经上传到网上的图片。之前写的时候是在本地写的，想要一样大小的图片，可以自己修改，然后设置遮罩层的高度和宽度就OK了。不过因为我没有图床，就只能使用网上的图片，而又不想拉伸图片使图片变型，这就出现了问题，每张图片的高度不一样（比较庆幸的是，我找的素材好几张图片是宽度一样的，高度略有差别，素材来源于物种日历里面介绍蓝鲸的那篇文章）。于是就想着能不能读取图片的高