【HTML实战】把专属于她的爱心代码放在自己的网站上是一种什么体验？

 一、  写在前面的话

        看多了李洵的炫酷爱心，今天来点不一样的爱心代码。需要李洵的炫酷爱心代码请看我的上一篇文章。

        最近随着电视剧《点燃我温暖你》的火热播出，剧中帅气学霸李洵的炫酷爱心代码也迅速火出了圈，作为一个喜欢动手实践的我来说正是一个大好机会啊，于是我就把代码搬到了自己的网站上，源码我也放在了我的GitHub上，大家有需自取哦~

仓库地址：https://gitee.com/longdebug/web-love-http.git
 

源码企鹅群号：473193131  或者本人企鹅号：483062431

后面有时间的话我会将各式各样的爱心代码更新在这个仓库里和群里，如果大家感兴趣的话就来和我一起创造爱心吧~

二、不一样的爱心

（1）爱心PPT

               纯前端项目，Html+js照片和音乐这些都可以自行更改。先来看效果图，一张图片一张图片的播放，整体是一个爱心。如果要更改对应文字改对应图片即可。

1、效果图

整体效果

单张图片效果

2、来吧，代码展示

主要代码：

	
	
	
	
	
	
	


	

		

			

				
XX ❤ XX 一生一世
				
按键盘 "↓" 开始倾听工科男的浪漫表白
			
			

				
过去的XX一直是一个人生活，享受着孤独，也憧憬着爱情。
				
			
			

				
一个人的长廊
				
			
			

				
一个人的山岗
				
			
		
		

			

				
一个人的地铁
				
			
			

				
一个人的游乐场
				
			
			

				
但他依然乐观，微笑着，等待着
				
			
			

				
生活难免有风风雨雨
				
			
			

				
他总是能够轻松的应对
				
			
			

				
并且面带阳光、自信的笑容
				
			
		
		

			

				
生活也不会总是一帆风顺
				
			
			

				
但他每次都能勇敢的面对
随时准备接受生活的挑战
				
			
			

				
				
可是XX的爱情又在哪里呢？
			
			

				
在镜子里面吗？他不敢相信
				
			
			

				
他去问大树，我的爱情在哪里？
大树告诉他，也许就在不远的地方
				
			
			

				
于是，XX一个人继续向前走
走在茫茫的雪地上
				
			
			

				
直到有一天XX与XX相遇了
				
			
		
		

			

				
XX喜欢XX，非常非常的喜欢，因为XX的出现，XX脸上有了更加灿烂的笑容
				
			
			

				
可是XX会喜欢XX吗？
				
			
			

				
				
XX想。。。
				
			
			

				
XX想和XX在一起
				
			
			

				
然后XX会经常去找XX
				
			
			

				
然后两个人一起出去玩
				
			
			
	
				
晚上XX会把XX送回家
				
			
		
		

			

				
直到很晚
XX再一个人回家
				
			
			

				
然后高兴地进入梦乡，在梦中还会和XX在一起
				
			
			

				
XX想成为了XX的逛街助手
				
			
			

				
然后，XX和XX一起去很多地方玩
				
			
			

				
XX也想和XX一块成为一对吃货
				
			
			

				
再然后，他们会搬到了一起
				
			
			

				
再然后，XX会开始学习她的技能
				
			
		
		

			

				
煮饭
				
			
			

				
那时候，每天早上，他们吃着自己做的美食
				
			
			

				
然后在同一个站台，高高兴兴的一起上班
			
			

				
XX会感觉自己好幸福。
因为自己有了家
那个有XX在的地方
				
			
			

				
他们可能偶尔也会吵架
				
			
			

				
XX不想这样
				
			
			

				
				
一定是我有什么做的不对，XX会这么想
			
		
		

			

				
如果没有XX在身边，窗外就没有风景
				
			
			

				
如果没有XX在身后
				
			
			

				
				
				
 XX又怎会飞的更高更远
			
			

				
XX不想这样。他要为XX改变自己
XX不知道XX喜欢什么，但他一定会满足她的一切。
				
			
			

				
				
我愿意一直陪伴着你
			
			

				
爱情就像花草一样
需要用包容来浇灌
				
			
			

				
直到一天，XX不想让自己后悔
XX开始准备一份惊喜
				
			
		
		

			

				
				

					看着惊喜一点点准备好了
					XX好开心
					因为他想象着XX看到时
					开心的样子
				
			
			

				
				

					想想未来他们或许
                    会有一辈子
					XX好开心
					或许他可以和XX一起
					去全世界好多地方玩
				
			
			

				
XX也会继续努力
为了他和XX的梦之城堡
				
			
			

			
				

					XX很幸福，因为他遇到了XX。他相信后面的每天都会是快乐的

					简简单单，体会与XX在一起的每一个刻
				
			
			

				
XX想和XX一起过幸福的生活
				
				
			
			

				

					永远有多远？

					比时间多一秒就是永远，我会永远爱你

					世界有多大？

					你走到哪里，世界就有多大
					
			
		
		

			

				
如果三年后你注定是我女朋友，你何不提早行使你的权利
				
			
			

				
				
我爱你
			
			

				
I love you
			
			

				
				

					我相信，XX和XX的故事会一直继续下去。

					无论精彩、平淡都会是他们喜欢的。

                    XXX，我爱你

					

					

					 -- 按“Esc"键有惊喜
				
				
			
		
	
	
您的浏览器禁用了javascript，无法正常浏览本页面
	

	

	
	
	
	
	


	

 整体文件夹：

需要下载文件的请加群下载或者文章开头提到的下载仓库。

（2）简单跳动爱心

        看了上一个比较难的爱心，这下来一个简单的爱心教程吧，直接一个文件搞定。

1、老规矩先看效果。

开玩笑的这不是真的。来了来了，它来了。

2、代码展示

    
    
    
    
    
    




    

        

        

        

    

    每次遇见你都心跳加速!

    

    

需要文件也可以到群文件下载。

（3）收缩的专属爱心

       

爱心千千万，还不如一颗专属爱心。

1、效果演示

2、代码展示

    
    
    





送给我的小婷婷

三、写在最后的小福利

        一个三个爱心够了，不能再多了

第一个比较难，有多个文件相互引用，想实现跨越直接下载群里的文件，修改照片和音乐就可以了，第二个和第三个比较简单，只有一个文件。如果是手机实现第二个和第三可以先创建一个txt文件再把代码复制进去，最后修改后缀名为html就可以了。周周学java