Html 图像上的文本覆盖

我使用的是master slider插件。slide1 2 3都有不同的类。试图在图像上放置文本，但不显示。我试过这个 但是什么也看不见

.classnameslide1:before {
content: 'Text inserted before via CSS';
 }  
and  
.classnameslide1:after{
content: 'Text inserted before via CSS';
 }

---

对伪元素使用父元素的相对位置和绝对位置，如

.classnameslide1 {position: relative; z-index: 1}
.classnameslide1:after {content: 'Text inserted before via CSS'; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3}

---

用示例添加html以避免被否决。我正在尝试使用CSS插入文本，而不是通过html（常规方式）插入文本的html，因此我正在添加classnameslide2 classnameslide3 classnameslide4给我空白的第二和第三张幻灯片