程序员制作网站告白女朋友

简介: 创意版权:容大教育 编辑:潇洒坤效果图如下,有动画效果:效果图.jpg1. 下载python2.7,已经安装python则跳过此步链接: https://pan.baidu.com/s/1zfuhR8w3DlxsleU6phglBw 密码: ugbxpython2很小,只有20M。

创意版权:容大教育
编辑:潇洒坤
效果图如下,有动画效果:

img_23f8c6e7ec057a432febae02a79200cf.jpe
效果图.jpg

1. 下载python2.7,已经安装python则跳过此步

链接: https://pan.baidu.com/s/1zfuhR8w3DlxsleU6phglBw 密码: ugbx
python2很小,只有20M。下载后进行安装,安装步骤如下:
1(1).如果打不开msi文件,请自行网上搜索解决方法。
1(2).双击安装文件后,进入下图界面,点击next

img_e750930f70772b6afb5ded256f2485df.png
安装1.png

1(3).如下图所以,直接把安装路径设置成 D:\python27,然后点击next。
img_77fdf6375742d639dc3e36f2d86b78a3.png
安装2.png

1(4).修改下图
img_5c496ceb2ce5a8e59262a25b78a607d0.png
安装3.png

img_a523137413ea1156ec753c761a00fe80.png
安装4.png

改为下图,点击next


img_22e479608e79304c3a4951b01498ba31.png
安装5.png

1(5). 进入安装


img_0d000014c339fdf477ab1903facf5a4b.png
进入安装.png

1(6)点击FInish完成安装,之后会提示重启,点击NO不重启。

img_28fd90e4bca653b05f943e1c76953fd0.png
完成安装.png

2. 下载网站模板

下载链接: https://pan.baidu.com/s/1QZsyWoltOVUIbjoH1n4JNw 密码: fcht
下载完成后解压,进入解压后的文件,如下图。

img_1f8c352ead26b6d96b81722b62d1bd2a.png
进入文件夹.png

3. 在当前文件夹目录下打开cmd

方法如下图所示,输入cmd,然后按Enter,则基于当前文件夹打开cmd


img_813bb623e246461594107abd0f29ba32.png
进入cmd.png

4. 在cmd输入命令

命令:D:\Python27\python web.py
作用是用前面安装的python运行web.py这个文件。
在之后的操作中,这个cmd框不能够关闭

img_b8d98922c8fdc444b4dbd8c6c710c850.png
在cmd中运行命令.png

5. 从浏览器查看效果

在你电脑中选择任意浏览器,打开网址http://localhost/,则可以看到如下图所示效果。

img_da3b1343bf4344c8f0cc030c44015811.png
image.png

此时你已经将网页发布到电脑的80端口,但是外网不可以访问。

6. 让你的网页外网可以访问

首先还是重复步骤第3步,基于网页项目的文件夹打开cmd。
输入命令:ngrok.exe http 80,如下图所示,按Enter键运行。

img_5735533429730c48599c8bc3e16f6c7c.png
运行命令.png

ngrok软件运行的效果图
img_31b4201f10b9756c355be5bdf5667e35.png
运行效果.png

如上图所示,我可以在外网访问的地址是 http://70137e51.ngrok.io,因为这个是即时生成的,所以每次网站发布以后外网可以访问的链接 都不同

7. 外网访问

用浏览器访问这个网址,效果如下图所示。


img_642b90b8c375f01e7589f1b88dcd9757.png
外网访问.png

8. 编辑网页内容

根据自己的实际情况修改网页内容。打开"index.html"文件进行编辑。


img_b12501e5f982b3bbfa4f785b582200a1.png
指明编辑网页文件.png

8(1).修改恋爱开始日期,今日日期,两人的姓氏,总共四处,如下图所示

img_129b4858c39c4a7ef98e430dc7421c4e.png
修改1.png

8(2).修改寄语,姓名

img_4637469284087c398e177500c2508074.png
修改2.png

8(3).修改动态计时数据

关键是日期,比如2016年2月14日在一起,则修改为together.setFullYear(2016,1,14)
js的month从0开始,1-12月分别对应0-11。
setHours,setMinutes,setSeconds,setMilliseconds,分别是在一起那一刻的时、分、秒、毫秒。

img_73b048cafda200f6b3c0a223207ab47d.png
修改3.png

修改 index.html文件完成后保存,此时再访问外网链接则可以得到更改后的网页。

目录
相关文章
|
6月前
|
移动开发 前端开发 JavaScript
童年回忆——开心消消乐(内含源码inscode一键运行)
童年回忆——开心消消乐(内含源码inscode一键运行)
|
前端开发 JavaScript
中秋之美——html+css+js制作中秋网页
中秋之美——html+css+js制作中秋网页
679 0
中秋之美——html+css+js制作中秋网页
|
前端开发 程序员
程序员也可以很浪漫,精选10个圣诞节特效及源码
最近离圣诞节不远了、整理了一些关于圣诞相关的前端特效网页设计和小游戏的代码送大家、直接上效果吧。 代码过长的 可直接预览获取 [快速预览](https://www.hereitis.cn/articleDetails/969)
程序员也可以很浪漫,精选10个圣诞节特效及源码
|
5月前
|
Java 关系型数据库 MySQL
浪漫编码:手把手教你实现校园表白墙功能
浪漫编码:手把手教你实现校园表白墙功能
69 0
|
程序员 Swift
谁说程序员不懂浪漫,教你使用SwiftUI搭建一个电子相册送给她吧~
谁说程序员不懂浪漫,教你使用SwiftUI搭建一个电子相册送给她吧~
191 0
使用 bookdown 构建新年日记本
使用 bookdown 构建新年日记本
117 0
|
小程序
女神节你也能自己动手制作一个漂亮的微信小游戏
嗨!大家好,我是小蚂蚁。 这是我之前制作的一个非常漂亮的微信小游戏,你可以给予它进行改编,然后自己制作一个小游戏送给你想送的人。 我发现这篇文章每年至少可以发四次,情人节一次,女神节一次,520一次,七夕一次[阴险]。 今年的我做了点儿改进,增加了一首背景音乐,是经典的《卡农》钢琴曲,希望你喜欢。
95 0
|
SQL JavaScript Java
搭建情人节表白网站(超详细过程,包教包会)
网站的搭建其实在七夕的时候就已经弄好了,只是当时不会搭建,然后就放了好几个月,偶然发现情人节快到了,遂重新搭建了这个网站,不过说实话除了网站还真想不出有啥能够体现程序员的特长,你说各种代码,c,c++,java即时给你做出不错的GUI界面,人家还不一定会打开,网站最容易了,有手(机)就行,下面是它的效果展示视频,觉得好的记得三连哦
425 0
搭建情人节表白网站(超详细过程,包教包会)
|
前端开发 JavaScript UED
「CSS畅想」何以解忧,美食足矣,用技术给好友开发了一个零食盲盒小游戏
前端技术从业者与非技术好友互动,用技术给好友开发了一个零食盲盒小游戏
261 1
|
程序员 Android开发 iOS开发
程序员五一修图小贴士
程序员五一修图小贴士
156 0
程序员五一修图小贴士
下一篇
无影云桌面