html5如何让图片3d旋转?
展开全部
图片旋转可以用CSS3中的动画效果来做,CSS3中,允许使用 3D 转换来对元素进行格式化。
示例代码如下:
<style>
*{margin:0;padding:0;}/*简单可以自定义,参照上面*/
body{font:14px/1.5 "\5FAE\8F6F\96C5\9ED1","\5B8B\4F53", sans-serif, Arial, System;background-color:#FFF;}
#imgg{animation:imgg 1s linear 0s infinite;}
@keyframes imgg{0% {transform:rotateY(0deg);}25%{transform:rotateY(90deg);}50%{transform:rotateY(180deg);}75%{transform:rotateY(270deg);}100% {transform:rotateY(360deg);}}
</style>
<div id="demo">
<img src="图片地址" alt="" width="100" height="100" id="imgg">
</div>
示例代码如下:
<style>
*{margin:0;padding:0;}/*简单可以自定义,参照上面*/
body{font:14px/1.5 "\5FAE\8F6F\96C5\9ED1","\5B8B\4F53", sans-serif, Arial, System;background-color:#FFF;}
#imgg{animation:imgg 1s linear 0s infinite;}
@keyframes imgg{0% {transform:rotateY(0deg);}25%{transform:rotateY(90deg);}50%{transform:rotateY(180deg);}75%{transform:rotateY(270deg);}100% {transform:rotateY(360deg);}}
</style>
<div id="demo">
<img src="图片地址" alt="" width="100" height="100" id="imgg">
</div>
展开全部
图片旋转可以用CSS3中的动画效果来做,CSS3中,允许使用 3D 转换来对元素进行格式化。
示例代码如下:
<style>
*{margin:0;padding:0;}/*简单可以自定义,参照上面*/
body{font:14px/1.5 "\5FAE\8F6F\96C5\9ED1","\5B8B\4F53", sans-serif, Arial, System;background-color:#FFF;}
#imgg{animation:imgg 1s linear 0s infinite;}
@keyframes imgg{0% {transform:rotateY(0deg);}25%{transform:rotateY(90deg);}50%{transform:rotateY(180deg);}75%{transform:rotateY(270deg);}100% {transform:rotateY(360deg);}}
</style>
<div id="demo">
<img src="图片地址" alt="" width="100" height="100" id="imgg">
</div>
示例代码如下:
<style>
*{margin:0;padding:0;}/*简单可以自定义,参照上面*/
body{font:14px/1.5 "\5FAE\8F6F\96C5\9ED1","\5B8B\4F53", sans-serif, Arial, System;background-color:#FFF;}
#imgg{animation:imgg 1s linear 0s infinite;}
@keyframes imgg{0% {transform:rotateY(0deg);}25%{transform:rotateY(90deg);}50%{transform:rotateY(180deg);}75%{transform:rotateY(270deg);}100% {transform:rotateY(360deg);}}
</style>
<div id="demo">
<img src="图片地址" alt="" width="100" height="100" id="imgg">
</div>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询