html5如何让图片3d旋转？
2个回答
展开全部
图片旋转可以用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>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
AiPPT
2024-09-19 广告
随着AI技术的飞速发展，如今市面上涌现了许多实用易操作的AI生成工具1、简介：AiPPT: 这款AI工具智能理解用户输入的主题，提供“AI智能生成”和“导入本地大纲”的选项，生成的PPT内容丰富多样，可自由编辑和添加元素，图表类型包括柱状图...
点击进入详情页
本回答由AiPPT提供
展开全部
图片旋转可以用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>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
