使用flexbox html/css在库中悬停图像时显示文本

我正在尝试创建一个图像库，我希望使用flexbox将文本悬停在图像上，但我不确定如何实现它。代码如下：

.gallery-links-h2{
字体系列：双体船；
字号：28px；
字号：600；
颜色：#111；
文本转换：大写；
文本对齐：居中；
填充：20px；
}
.图库链接{
显示器：flex；
柔性流：行换行；
证明内容：中心；
}
.图库-image-1{
弹性基准：70%；
利润率：10px；
}
.图库-image-1{
宽度：100%；
}

画廊

请参阅此链接。代码中没有文本。那么文本应该出现在哪里呢？谢谢@AkhilAravind我会检查一下的。Paulie_D我知道，我不知道在哪里或如何插入它，我曾考虑创建一个标签，标签内有文本，但它没有工作。其思想是，当您将鼠标悬停在图像上时，文本将显示在图像的顶部，居中。我的html知识非常基础，我一直在看教程，但还有很多东西我还不明白。