本文实例为大家分享了抖音上用记事本编写爱心小程序的具体代码,供大家参考,具体内容如下
先上一波效果图:
一颗旋转的小心心
七夕的前一天晚上,当我满怀期待的把这颗爱“心”展示给我女朋友的时候,我以为她会非常. .
快乐. .
但是. .她和我说你给我颗大蒜干什么啊. .
你为什么给我一个大蒜. .
也就是那个时候,我突然觉得这真的像一颗大蒜哎
好啦,不多说了。直接上源代码:
& lt; !DOCTYPE html>
& lt; html lang=坝τ谩北?
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt; title> Document
& lt; style>
@keyframes ani {
从{
变换:rotateY(0度)rotateX(0度);
}
,{
变换:rotateY(360度)rotateX(360度);
}
}
身体{
角度:1000 px;
}
#{心
位置:相对;
身高:200 px;
宽度:150 px;
保证金:200 px的汽车;
动画:ani 5 s线性无限;
传输格式:preserve-3d;
}
.line {
位置:绝对的;
身高:200 px;
宽度:150 px;
边界:2 px固体红;
border-left: 0;
边界底部:0;
border - radius: 50% - 50% 0/50% 0 40%;
}
#{词
字体类型:“隶书”;
字体大小:1.3 em;
颜色:红色;
位置:绝对的;
前:80像素;
左:22 px;
粗细:大胆的;
}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div id=靶摹痹?
& lt; div id=暗ゴ省痹谖野甕ou
& lt;/div>
& lt; script>
var心=. getelementbyid(“心”);
var html=" ";
(var i=0; i<36,我+ +){
html +=" & lt; div类==跋摺狈绺竦谋浠?rotateY (“+ i * 10 +”度)rotateZ(45度)translateX (25 px)的祝辞& lt;/div>”;
}
的心。innerHTML +=html;
& lt;/script>
& lt;/body>
& lt;/html>
之前
运行这串代码也是非常简单,打开记事本,复制粘贴,将后缀名改为。html。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
