Jquery 在幻灯片上的框中放置文本

目前，word press中幻灯片放映（使用unslider.js）上的一张图片如下所示：

我对每个图像的html如下所示：

 <li style="background-image: url('<?php echo get_template_directory_uri();?> /images/photos/pearl2.jpg');">

         <h1>The jQuery slider that just slides2 2.</h1>
             <p>No fancy effects or unnecessary markup, and it’s less than 3kb. 2</p>
             <a class="btn" href="#download">Download</a>

         </li>

---

您必须从

li

的背景中删除图像，因为这里

您需要处理CSS，作为一种尝试，请将以下样式应用于
：-

li {
  text-align: right;
}

你可以试试这个

小提琴：


只需滑动2的jQuery滑块。
没有花哨的效果或不必要的标记，并且小于3kb。二,

你也可以浏览你的CSS。我不能添加多个背景，比如在li级别添加一个背景，而在inside div级别添加第二个背景吗？天空是极限，无论你能用html和CSS在列表项目内部实现什么，滑块都会使用。这就是为什么它在那里的原因。我试过这个，它只在最后一张幻灯片上有效，而不是在幻灯片放映的每一张幻灯片上。你知道如何修复它吗？
li {
  text-align: right;
}

<div style="position:absolute; background:#ccc; padding:10px; right:0; bottom:0">
         <h1>The jQuery slider that just slides2 2.</h1>
         <p>No fancy effects or unnecessary markup, and it’s less than 3kb. 2</p>
         <a class="btn" href="#download">Download</a>
</div>