
下面是内存溢出 jb51.cc 通过网络收集整理的代码片段。
内存溢出小编现在分享给大家,也给大家做个参考。
<!DOCTYPE HTML><HTML><head> <Meta charset="utf-8"> <Title>transform-style的3D效果测试</Title><style>*{Font-size: 14px;color: #fff; padding:0; margin:0;}#container { position: relative; height: 300px; wIDth: 300px; -webkit-perspective: 500; @R_301_3724@: 200px; margin-right: auto; margin-left: auto;}#parent { margin: 10px; wIDth: 280px; height: 280px; background-color: #666; opacity: 0.3; -webkit-transform-style: preserve-3d; -webkit-animation: spin 15s infinite linear;}#parent > div { position: absolute; top: 40px; left: 40px; wIDth: 280px; height: 200px; padding: 10px; -webkit-Box-sizing: border-Box;}#parent > :first-child { background-color: #000; -webkit-transform: translateZ(-100px) rotateY(45deg);}#parent > :last-child { background-color: #333; -webkit-transform: translateZ(50px) rotateX(20deg); -webkit-transform-origin: 50% top;} /*执行Y轴旋转360度动画*/@-webkit-keyframes spin { from {-webkit-transform: rotateY(0);} to {-webkit-transform: rotateY(360deg);}}</style></head> <body> <div ID="container"> <div ID="parent"> <div><a href="/">CSS3很强大</a></div> <div><a href="/">很强大的CSS3</a></div><!-- <div>sadasdas</div> --> </div> </div></body></HTML> 以上是内存溢出(jb51.cc)为你收集整理的全部代码内容,希望文章能够帮你解决所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
总结以上是内存溢出为你收集整理的CSS3很强大全部内容,希望文章能够帮你解决CSS3很强大所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)