首页 > 分享 > 爱情历程风雨爱情我们的爱情表白说爱你 wuxia2001

爱情历程风雨爱情我们的爱情表白说爱你 wuxia2001

花匠小妙招
2025-05-02 14:55

I LOVE YOU BABY

我们的爱情故事

源码/修改

因为刚做出来，一来不知道效果如何，二来也还没时间去整理，代码有些凌乱，所以暂时没有开放，如果有需要，请发邮件到wuxia2001@sina.com

网站截图如下（有些动画效果自己去试更好）

使用时的注意点

我虽然这里没有放出源码，仅是因为没有整理好，愿意看和自己改的人找我要我一定会给的，这并非什么隐秘或重要的东西。当然同时这也是我花时间做的东西，有条件的还是可以赞赏一下的。

朋友们拿到源码后，直接用浏览器打开one.html，就得看到网站效果。里面的大部分控件都有动画效果，我建议就是动画效果就别动了。改文字和图片就行。

修改的话，用文本工具修改，最简单的用记事本打开，但一般并不推荐记事本，功能太少，不方便，推荐可以使用sublime，我用的就是这个，也可以vim，notepad之类。到于是不是要用开发工具，比如eclipse，webStorm,Dreamweaver,vc++,IntelliJ之类的，这些工具都是可以的，但专业性太高，你们用到的功能不到百分之一，完会是没必要的，如果本就安装了的，直接用这些工具打开也是可以的

用文本工具打开后，从上往下讲，第一行文字是："陪伴是最长情的告白，无论生老病死，我都愿陪你到天荒地老"，如果要改这行文字，你在这个文件里全局搜索就行，一般搜索都是ctrl+f，搜索这行字，修改成你想的就行。但凡是改文字的，都可以这样改。比如后面的时间，也都这样搜索到再改

中间的一男一女的图片，可以不用改，如果是女表男的话，图片要换一下，把boy.png换成boy_u.jpeg, 把girl.png换成girl_i.jpeg。这里，如果有高清的图像的话，可以改成自己的图片。这里的图片都放在images目录下

我的爱情历程，基本上是必改的，因为每个人的经历都是唯一的。在第72行 ul 开始的标签里，每个下属的li都是一个历程。可以复制第一个li标签(从<li>开头到</li>结束为一个li标签），改里面的文字和图片。有多少个历程，复制多少个li就行。但有区别的是，在双数 li 的class 里，多了个 timeline-inverted ，这是让文本框出现在右边。所以复制的时候，两个li一起复制就行。文字，图片和时间都自行设定吧。图片，这里可以统一改为自己的图片。但有的可能没有图片，就可以像我一样用卡通图片补充一下。

我们的山盟海誓这一段主要写一些感人肺腑的文字，有文采的自己写一些出来吧。

我们的爱情见证，那就是照片墙，放些好看的照片上去，从见面到现在保存的照片都放一点上去。记得PS美化一下，不懂PS的就用美图弄弄，别傻不傻的用太素颜的。

音乐的话，自己记得把音乐文件剪辑压缩一下，不要太大。替换MP3文件就行

建站

有了修改后的源码，还需要建站才能在网上被心爱的人看到，至于用新浪云如何建站，请大家移步到这： http://www.bigeone.cn/love/index.html

新浪云的建站主要是免费，用的次数不多，可以用新浪云。

但如果有意的朋友，可以自己申请域名和服务器(或虚拟主机），有心的朋友，我这里有大体教一下用阿里云如何建站。当然我这里只是简单讲一下建站，只是静态网页，不会有还有数据库啊什么之类的。

阿里云，先说一下价格。域名申请的话，一年的费用大约是.cn的一年29元， .com的一年也才60元，每年要续。

申请到域名后，要备案，阿里备案是免费的，但要拍照，照片需要背景幕布，需要阿里云邮寄给你，你再拍照上传，备案，这都是免费的。

备案的话需要主机，最便宜的云服务器就行，阿里云路径如下：阿里云主机云主机一般都比较贵，最便宜的一般300多一年，但是，如果遇到优惠，就很便宜，比如2018年双11，最便宜的主机，新用户300元3年。搞活动的时候主机还是比较便宜的。

弄到云主机后，就备案就行，阿里有教程，但要等20多天。如何域名在阿里买，则备案和主机都在阿里买，省很多事。后面这个地址是阿里的域名和备案的文档

备案完后，把域名解析到你的ip就行。如何就是主机建站。阿里是有教程的。在阿里上，还有镜像建站这些，不需要购买，这些帮忙自动建站的都是要付费的，真的不需要买，随便搞搞就能成功的。

这里需要付费的地方，就只有买域名和买主机，其他比如备案，建站都不需要再付费。主机如果是windows系统，就装IIS，就得电脑装个IIS一样，装软件一样很简单的。远程桌面登录上主机，IIS建站，百度一下，教程很多的，也很简单的，因为我们的网站只是静态网页，只要网站路径指向这里就行。如果是centorOS系统的话，就装tomcat就行。网上教程一大把的。