<!doctype html><html&呼和浩特职业gt;<head><meta chart="utf-8"><title>3daixin</title> <style type="text/css"> body{ background:black; } .heart3d{ position:relative; width: 100px; height: 160px; 关于法律的作文 /*border: 2px solid red; border-left:0; border-bottom: 0;*/ margin:50px auto; /*border-radius:50% 50% 0/40% 50% 0;/*斜杠前面是水平方向 斜杠后面是竖直方向 顺序是顺时针*/ /*transform: rotate(45deg);*/ animation: rot 20s linear infinite;/*自定义旋转旋转名称 20s 匀速旋转 无限重复*/ transform-style:prerve-3d; } /*关键帧：定义改变的值*/ @keyframes rot{ form{transform: rotatey(0deg)} to{transform:rotatey(360deg)} } .heart3d div{ position: absolute; left:0; top:0; width: 100px; height: 160px; border: 2px solid red; border-left:0; border-bottom: 0; 三项学习 /*margin:50px auto;*/ border-radius:50% 50% 0/40% 50% 0;/*斜杠前面是荷兰奶粉排行榜水平方向 斜杠后面是竖直方向 顺序是顺时针*/ transform: rotate(45deg); } </style></head><body&g高考口语考试t; <div class="heart3d"> <script type="text/javascript"> var heart3d=//定义一个变量来保存 //获取元素 //在文档里面get获取元素 document.getelementsbyclassname("heart3d")[0]; //在控制台里面的输出 console.log(heart3d) for (var i=0;i<36;i++) //for循环 循环变量 定义一个i变量 初始值0 循环36次 自己循环一次 { var odiv =document.createelement("div");//在文档里面创建元素 odiv.style.transform = "rotatey("+i*10+"deg) rotatez(45deg) translatex(30px)"; heart3d.appendchild(odiv);//往它里面添加子元素 } </script></body></html>
本文发布于:2023-04-03 14:28:09，感谢您对本站的认可！
本文链接：https://www.wtabcd.cn/fanwen/zuowen/ab54e28a7d466e2fe3a0e4858ded82fe.html
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
本文word下载地址：3d爱心代码.doc
本文 PDF 下载地址：3d爱心代码.pdf
| 留言与评论（共有 0 条评论） |
