如何仅使用javascript和css3执行卡片翻转动画

我基本上是在展示一张卡片。我想在单击它时水平翻转它。 情况是：

html:

css:

---

可能吗？

是的。。。关键帧，你知道吗？这当然是可能的。您可能需要查看CSS3属性“perspective”（透视图）。看起来很有趣，但是。。。它使用2个div，一个用于前面，一个用于后面。我只有一个img标记…@S.P.“透视图3”部分（）中的立方体对每个面只使用一个html元素。1 2 3 4 5 6有6个图形，每个立方体面一个。在卡片翻转示例中，有2个数字标记：1 2

<img id="card0" src="card/back.png" class="myCard" />

    $('#card0').click(function () {
        $('#card0').attr("src", cards[i].src);
    });

.myCard {max-width: 18%;}