×

一个完整的html代码怎么编写

一个完整的html代码怎么编写(如何写一个html生日快乐的代码)

admin admin 发表于2024-01-20 19:13:07 浏览39 评论0

抢沙发发表评论

大家好,关于一个完整的html代码怎么编写很多朋友都还不太明白,不过没关系,因为今天小编就来为大家分享关于如何写一个html生日快乐的代码的知识点,相信应该可以解决大家的一些困惑和问题,如果碰巧可以解决您的问题,还望关注下本站哦,希望对各位有所帮助!

本文目录

如何写一个html生日快乐的代码

前几天一个朋友找到我,他说他女朋友马上过生日,于是想问问我能不能写一个生日祝福代码。好兄弟的请求当然不能拒绝,直接安排!!

于是我用html写了一个简单的页面:点开后会显示来到这个世界多长时间和祝福话语,下滑后是自转相册(有背景音乐)。

原文链接:

html生日快乐代码

核心代码(不是完整代码):

#head{width:100%;height:100%;position: absolute;-webkit-transform-style: preserve-3d;-webkit-animation:donghua 15s linear 0s infinite;-moz-transform-style: preserve-3d;-moz-animation:donghua 15s linear 0s infinite;-ms-transform-style: preserve-3d;-ms-animation:donghua 25s linear 0s infinite;}#head div{position: absolute;top:0;left:0;width:300px;height:400px;border:1px solid #000text-align: center;line-height:100px;}#head div:nth-child(1){-webkit-transform:rotateY(0deg) translateZ(400px);-moz-transform:rotateY(0deg) translateZ(400px);-ms-transform:rotateY(0deg) translateZ(400px);background:url(images/01.png);background-size:cover;}12345678910111213141516171819202122232425262728293031Heart.prototype.draw = function(){this.size -= this.speedSize;this.x += this.speedX;this.y += this.speedY;ctx.save();ctx.translate(-1000,this.y);ctx.scale(this.size, this.size);ctx.beginPath();for (var i = 0; i 《 precision; i++) {var vector = this.vertices;ctx.lineTo(vector.x, vector.y);}ctx.globalAlpha = this.size;ctx.shadowBlur = Math.round((3 - this.size) * 10);ctx.shadowColor = "hsla(0, 100%, 60%,0.5)";ctx.shadowOffsetX = this.x + 1000;ctx.globalCompositeOperation = "screen"ctx.closePath();ctx.fill()ctx.restore();};function render(a){requestAnimationFrame(render);hearts.push(new Heart())ctx.clearRect(0,0,ww,wh);for (var i = 0; i 《 hearts.length; i++) {hearts.draw();if(hearts.size 《= 0){hearts.splice(i,1);i--;}}}onResize();window.addEventListener("mousemove", onMove);window.addEventListener("touchmove", onMove);window.addEventListener("resize", onResize);requestAnimationFrame(render);window.οnlοad=function starttime(){time(h1,’2000,1,1’);     // 出生时间ptimer = setTimeout(starttime,1000); // 添加计时器}function time(obj,futimg){var nowtime = new Date().getTime(); // 现在时间转换为时间戳var futruetime =  new Date(futimg).getTime(); // 未来时间转换为时间戳var msec = nowtime-futruetime; // 毫秒 未来时间-现在时间var time = (msec/1000);  // 毫秒/1000var day = parseInt(time/86400); // 天  24*60*60*1000var hour = parseInt(time/3600)-24*day;    // 小时 60*60 总小时数-过去的小时数=现在的小时数var minute = parseInt(time%3600/60); // 分 -(day*24) 以60秒为一整份 取余 剩下秒数 秒数/60 就是分钟数var second = parseInt(time%60);  // 以60秒为一整份 取余 剩下秒数obj.innerHTML="陈陈《br》你已经来到这个世界:《br》"+day+"天"+hour+"小时"+minute+"分"+second+"秒"+"了《br》《span》今日是你的生日,愿所有的快乐、所有的幸福、所有的温馨、所有的好运围绕在你身边。生日快乐!《/span》《p》下《br》滑《br》有《br》惊《br》喜《/p》"return true;}1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162

效果如下:

这里面的文字可以自行修改,并且时间是会一直走动的,出生时间改成你女朋友的。

下滑后有自转照片:

照片可以自己换哦。

补充:

很多朋友想手机端打开文件,那就需要换图片的地址和音频的地址(你可以发一个仅自己可见的说说,然后就可以生成图片的链接地址了),此时只需要发html文件就可以用手机浏览器打开了。上图的地址换成图片的链接网址(一共十个)。

***隐藏网址***上图的地址换成音频的链接网址。

大家可以网上找音乐外链。如果是特定的音频录音,可以用这个方法:利用邮箱附件的形式,比如QQ邮箱,给自己发一封邮件,把音乐以附件的形式附带在上面,收信的时候用来下载附件的那个地址,就是歌曲的下载链接了。

完整项目:

里面有我自己找的十张照片和两个背景音乐(可以换成自己的录音),另外还有使用说明。

完整项目地址:html生日快乐代码

如何编写一个html文件在线等!!

1、新建一个文本文档。

2、打开文本文档后,输入

《html》

《head》

《title》这是一个网页《/title》

《/head》

《body》

《h1》hello,人生《/h1》

《p》 《font size="8"face="Verdana"》寂寞如雪《/foot》《/p》

《/body》

《foot》

《/foot》

《/html》。

3、输入段代码后,点击保存,保存类型设置为所有文件,文件名保存为test.html。

4、点击保存后,一个html文件就做好了。

5、点击就可以打开html文件了。

OK,关于一个完整的html代码怎么编写和如何写一个html生日快乐的代码的内容到此结束了,希望对大家有所帮助。