CSS でカードをめくる動きを再現する方法を紹介します。 ベースのコードを紹介 コードの解説 スマホ対策 ベースのコードを紹介 CSSでカードをめくるような動きを再現する方法を紹介します。 いくつかポイントがありますので順を追って説明します。 まずは最初に、動きのサンプルとベースのコードを紹介します。 その場でめくれる動き その場でめくれる動きのサンプルです。カードにカーソルを合わせてボタンを押し下げたときに動作します。 ベースの HTML はこちら。 <div class="flip"> <div class="front"></div> <div class="back"></div> </div> めくれると大きくなる動き その場でめくれると大きくなる動きのサンプルです。カードにカーソルを合わせてボタンを押し下げたときに動作します。 ベースの HTML はこちら。 <div clas
![CSS カードをめくる動きを再現する方法 - by Takumi Hirashima](https://cdn-ak-scissors.b.st-hatena.com/image/square/ec33fe1b627738319ad202ae8e3a2ed446286914/height=288;version=1;width=512/https%3A%2F%2Fhirashimatakumi.com%2Fwp%2Fwp-content%2Fthemes%2Ftakumihirashima%2Fimg%2Fogp.png)