Css 多重图像交叉淡入淡出

我已经寻找了几个小时的答案，但我仍然没有找到任何真正有效的方法

我有一个

div

，它包含3个

img

元素。我想在一个无限循环中一个一个地淡入下一个

我知道它可能包括动画，但我不能确切地理解如何工作，我需要改变哪些位来适应我需要的淡入淡出

谢谢大家的帮助！我真的很感激这一点，就像我以前用过的一样，试着弄明白这一点。我以前用过GIF，我觉得是时候继续前进了

以防您需要代码：

    <div id="showcase">
        <img src="../images/showcase/iphone2.png" width="175" height="202" />
        <img src="../images/showcase/m4.png" width="175" height="202" />
        <img src="../images/showcase/alloy.png" width="175" height="202" />
    </div>

---

正如我所说，我已经看了很多例子，我只是在寻找使用CSS从一个到另一个的基本渐变。我不想使用JavaScript。

尝试使用css动画：

注:

---

这不适用于非css3浏览器。

您是否已采取任何措施来解决此问题？如果你告诉我们你到目前为止做了什么，我们会更愿意回答你的问题。（询问更好问题的有用链接：，）“我不喜欢使用JavaScript。”有什么特别的原因吗？我相信这在CSS中是完全可能的，因此我想学习这种方式以及JS的可能性。我已经搜索了几个网站并尝试了它们的方法，但更多的问题是我无法理解动画是如何在CSS中工作的。可能重复：感谢这一帮助，我终于成功了！干杯尽管如此，网站还是很好地解释了这个话题。