Html 文本显示在图像后面（不需要），但在刷新时会就位

我（终于）开始学习如何写网页了。我有一个小问题：

我正在放一个带有一些图片的

（这是一个简单的幻灯片，效果很好），下面是另一个

中的一段（相关代码在下面）。但当我在浏览器中打开页面时，有时段落会出现在图像后面，但一旦我刷新页面，它就会出现在正确的位置

有时候最让我烦恼的事是什么。如果它总是出现在伊玛吉背后，我会知道我做错了什么。。。但事实并非如此。。。那么，我是不是遗漏了什么

因此，具体的问题是：如何确保第二个

始终显示在第一个

的下方

守则：

index.php



Suspendisse eu nibh ac ex interdum拍卖人。
尼西的库拉比图尔是一个自由的临时公民。
这是一个很好的例子。


css/index.css

#主面板{
最小高度：50em；
}
#主面板#幻灯片放映{
最小高度：430px；
位置：相对位置；
高度：自动；
宽度：80%；
左边距：10%；
保证金权利：10%；
}
#主面板#幻灯片显示图像{
显示：块；
左边距：2米；
最大宽度：80%；
宽度：480px；
位置：绝对位置；
排名：0；
左：0；
z指数：8；
}
#主面板#幻灯片显示img.active{
z指数：10；
}
#主面板#幻灯片显示img.last-active{
z指数：9；
}
#主面板。幻灯片放映\u文本{
显示：块；
左边距：10%；
保证金权利：10%；
左：2米；
右侧填充：2米；
字体系列：衬线；
字号：0.9em；
明确：两者皆有；
}

js/scripts/script\u main.js（以防出现问题）

函数滑动开关（）{
var$active=$（“#slideshow img.active”）；
如果（$active.length==0）{
$active=$（“#幻灯片显示img:last”）；
}
var$next=$active.next（）.length？$active.next（）：$（“#幻灯片放映img:first”）；
$active.addClass（'last-active'）；
$next.css（{opacity:0.0}）
.addClass（“活动”）
.animate（{opacity:1.0}，1000，function（））{
$active.removeClass（'active last active'）；
});
}
$（函数（）{
设置间隔（'slideSwitch（）'，5000）；
});
$（文档）.ready（函数（）{
var$slideshow_height=$（'slideshow img:first'）。height（）；
$（'slideshow'）.css（'min-height'，$slideshow\u height）；
});
$（窗口）。调整大小（函数（）{
var$slideshow_height=$（'slideshow img:first'）。height（）；
$（'slideshow'）.css（'min-height'，$slideshow\u height）；
});
早安：）我建议您使用z-index强制文本元素位于幻灯片元素之上，也许您应该尝试添加如下内容：

#mainpanel .slideshow_text {
    z-index: 12;
} 

你好问题不在于带有文本的
是否显示在带有图像的
后面或上方。。。在这种情况下，我也会尝试在你的#mainpanel#slideshow div中使用这种技巧。也许这是slideshow元素偏移定位的结果。