【CSS】backface-visibilityプロパティ~トランプカードをめくる

backface-visibilityプロパティはユーザー側に直面した際に要素の背面が表示されているか否かを指定します。 backface-visibilityプロパティは大きく2つに分かれています。

backface-visibility:visible;要素の裏面が見えて、裏面に表の鏡像が表示されます。

backface-visibility:hidden;に指定すると、裏面を不可視にし裏面に表の鏡像を表示しません。表の画像は透けて見えません。

このプロパティは、xまたはy軸に回転するなどtransformプロパティが指定されたオブジェクトに適用されます。backface-visibilityプロパティはCSS3に新たに追加されたプロパティです。

backface-visibility:hidden;

▼　以下のトランプカードにマウスカーソルを合わせてみてください。