[CSS]シャドウもくるっと！ふわりと浮かせた画像をくるっと回転させるスタイルシート

HTML 画像とキャプションのテキストをfigure要素で配置し、divで内包します。 <div class="flip-3d"> <figure> <img src="yacht.jpg" alt=""> <figcaption>Yacht</figcaption> </figure> </div> <div class="flip-3d"> <figure> <img src="bee.jpg" alt=""> <figcaption>Bee</figcaption> </figure> </div> シャドウ用の余分なマークアップは、必要ありません。 CSS まずはfigure要素を3Dにし、各画像をfloatで配置します。 div.flip-3d { perspective: 1200px; width: 30%; float: left; } div.flip-3d figure

[vitaminsii]

どこかで使ってみよう！

[hr07jp]

“[CSS]シャドウもくるっと！ふわりと浮かせた画像をくるっと回転させるスタイルシート”

[kazuya6012]

画像

[poppun1940]

画像にシャドウをつけてふわりと浮かせ、そのシャドウごとくるっと回転させるスタイルシートを紹介します。 シャドウ用の余計なマークアップは必要ありません。 CSS 3D Image Flip Gallery With Dynamic Shadows 静止画でポイントを

[jun200]

[CSS]シャドウもくるっと！ふわりと浮かせた画像をくるっと回転させるスタイルシート

[qrac_jp]

シャドウもくるっと！ふわりと浮かせた画像をくるっと回転させるスタイルシート

[typista]

シャドウもくるっと！ふわりと浮かせた画像をくるっと回転させるスタイルシート

[nors]

http://demosthenes.info/blog/726/CSS-3D-Image-Flip-Gallery-With-Dynamic-Shadows