如何在鼠标悬停时创建带文本的透明叠加层？

I'm getting super stuck on this and I feel like I really shouldn't be. I'm trying to have a transparent overlay with text appear on an image when your mouse hovers over the image. I have the transparent overlay working correctly, and the text appearing, but I can't figure out how to center the text or how to change the font, etc. It also looks like the bottom images aren't the same size, and I'm not sure why.I'm getting super stuck on this and I feel like