在精美图库中的图像上显示文本时出现问题

Question

我在“Slick”图库中的多个图像上添加文本时遇到问题。我可以获得想要在图库的第一张图片上显示的文本，但是在将文本添加到其他幻灯片时，它们只会出现在第一张幻灯片上。

我使用以下 css 进行文本叠加：

.classTextOver{
  position: absolute;
   font-size: 16px;
   color: white;
   top:60%;
  left:18%;
}

任何帮助将不胜感激。

您可以在此处找到代码 sn-p： https://jsfiddle.net/dkxq3ztg/1/

Answer 1

这个答案看起来可能会给幻灯片带来其他问题，但如果您使用相对定位，则可以解决文本问题。用这个替换你的 .ClassTextOver：

.classTextOver {
position: relative;
top: 300px;
font-size: 40px;
color: white;
font-family: 'champion';
font-weight:normal;
left:100px;
}