相关疑难解决方法(0)

一段时间以来,我一直在努力实现一个仅限CSS的幻灯片,一个会:

1. 提供前进和后退导航.
2. 不修改导航历史记录.
3. 为内容的移动指明明确的方向.
4. 尽可能多地使用浏览器.

我遇到的大多数其他CSS幻灯片都没有勾选所有这些框.

值得庆幸的是,我花了这么长时间以来,浏览器本身已经改进了无端,现在实际上已经非常广泛,尽管有一些"现代"的CSS主义.为了防止其他人对我有用,我想我会在这里发布.

那么如何使用CSS和以下标记创建可导航的幻灯片？

<ul class="css-slider">
  <li class="slide"><img src="photos/a.jpg" /></li>
  <li class="slide"><img src="photos/b.jpg" /></li>
  <li class="slide"><img src="photos/c.jpg" /></li>
  <li class="slide"><img src="photos/d.jpg" /></li>
  <li class="slide"><img src="photos/e.jpg" /></li>
</ul>