参见:https://jsfiddle.net/6oxt5nfe/
对于每张幻灯片，我希望图片说明出现在宝丽来的底部。我该怎么办？
我尝试在 HTML 中为每个 img 添加一个，但它只会影响一张幻灯片，而不会影响其余幻灯片。
Example: .caption {
top 10%
position: absolute
;
<img src=x><div id=caption>this is the caption</div></img>
想法？
最佳答案
要解决您的问题，您需要在图像和标题周围添加一个更大的包装，然后您可以将 img 和另一个 div 分开，用于更大包装内的标题(或者您也可以只使用 <p> 标签如果你愿意，但我更喜欢使用 div)
另请注意，一旦你制作了这样的包装器，你就不需要将 .slider 的边框宽度设置得如此之大(因为它只会在底部添加更多空白在您的标题下方)，所以我将其更改为 10px。
我为您做了一个我认为可以解决您的问题的示例，并且我尝试使其尽可能接近您的代码。
这是 fiddle :https://jsfiddle.net/6oxt5nfe/3/
关于html - 您将如何为这些图像添加标题？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33615244/