online Editor
transform-style | Transform - CSSリファレンス
transform-style - CSS3のtransform-styleプロパティのサンプルです。
<!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Sample</title> </head> <body> <style> .parent{ width:100px; height:100px; background:rgba(0,255,0,.5); -webkit-transform:rotateX(45deg) rotateY(45deg); transform:rotateX(45deg) rotateY(45deg); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .child{ width:100px; height:100px; background:rgba(255,0,0,.5); -webkit-transform: translateZ(100px); transform: translateZ(100px); } </style> <div class="parent"><div class="child"></div></div> </body> </html>
HTMLを反映する >>
タグ:
CSS
CSS3
Transform
transform-style
Web Creative Park