给女友的网页小惊喜,(生日,周年,表白通用) ☞谁说程序员不懂浪漫

有女朋友的拿去给女朋友一个惊喜,没女朋友的拿去表白,或者NEW它10000000个ε≡٩(๑>₃<)۶

文章目录

  • 前言
  • 适用范围
  • 网页展示
    • 登录界面
    • 文字界面
    • 图片界面
    • 尾部界面
  • 获取源码

前言

前些日子是女友的一周年,康康想用一种特殊的方式来庆祝,于是想到了通过做网页的方式来纪念这一天,但是在网上搜索了大量资源后发现很多都很老套,是很多年前的那种,这不符合康康的风格,于是利用搜集来的资料,加入了个人的理解和思路,以及最近流行的3D图册,经过不懈努力,做出了一套四网页,治愈风的html网页。(html+css+JavaScript)(含背景音乐)

适用范围

该网站主体使用少女粉配色,有四个界面,适合于于表白,庆祝生日,周年,以及给女友小惊喜,博主以及给大家整理好了模板,大家只需简单修改,即可用网页生成打开。
每一个网页都有背景音乐,网页默认禁止音乐播放,但是我发现,先点超链接到下一页,再回来就有背景音乐了,大家可以试试。
这里我建议大家在自己电脑上做好,录屏,然后一步步操作,发给你的女友。
(下面是详细使用说明)

网页展示

登录界面

在这里插入图片描述第一张图片可以放女友的照片。

博主在这里用的是女友照片的q版本头像,如果需要,可在某宝搜索q版头像绘画,自行选择。

Happy First Anniversary是一周年快乐的意思,可根据需要自行修改。

<h1>Happy First Anniversary</h1>

修改照片只需要将文件hello.html中的src改一下即可

<img src="../static/img/yali2.png" width="300px" >

用户名和密码可以输入有意义的一串字符,(这里没设置具体的值)
然后点击i am here进入下一页文字界面。

文字界面

在这里插入图片描述

这里有两个版本
第一个是文字版,第二个是图片版
使用时删除文字或图片使用。
选择一个选择使用,模板给大家准备好了,如果有自己想说的话把文字全删了改成自己想说的即可,文字版比较简陋,图片版是高配版,根据自行需要选择。

文字版
这里文字自行修改,同上

<h1>大哥没文化,大哥也不太会说话,但是大哥爱你</h1>相信我们未来会一起携手走过,</br>回头看看我们也经历了很多酸甜苦辣,</br>有甜蜜,有争吵,也有闹小性子的急切,也有相互关心的温暖,</br>相信所有的爱在未来都会成长为参天大树,</br>那些绊脚石也都会成为我们通往幸福路上的铺垫。</br>曾记否,去年今日,夜幕降临,漫漫一望无际的银河,</br>是你的出现闪耀了我整个天河,</br>在爱与期望中我追逐着你的耀眼星光,</br>你拉起我,我们一起遨游在璀璨的星河,</br>宇宙宽广星河且长,我们一起跳过一颗又一颗星球,</br>终于,我们找到了那颗属于我们自己的星球,</br>希望我的宝贝能在我们的星球里。</br>一要快乐,</br>二要健康,</br>三要顺心,</br>四要充实,</br>五要聪慧,</br>六要富贵,</br>last not but least</br> 要爱我哟!
</br>(づ ̄3 ̄)づ╭❤~</br>

图片版
在这里插入图片描述
文件夹中已经给大家准备好了信封的word格式,
大家改改文字导出图片把原图片替换掉即可。(博主用到了特殊字体,下载到你的电脑上可能不显示,如果需要,文件夹中给大家带的有字体,大家自行安装)

`<img src="../static/img/letter.jpg"  width="500px"  >`

图片界面

在这里插入图片描述这个应该是本文最炫酷的部分了,相信女友收到的瞬间肯定会喜欢的。

这个部分比较简单,大家只需要找到img文件夹,把12张图片换成自己女朋友的即可,别忘了把图片的名字换成和之前一样的哦。如果格式不一样就直接把图片位置改掉,修改位置如下。

<div class="out_front"><img src="../static/img/1.jpg"  class="pic" >

尾部界面

在这里插入图片描述

尾部就是用烟花的形式来进行收尾,让你的女朋友回味无穷。

获取源码

版权声明:
本文版权归csdn @康康爱吃肉所有
欢迎转载,
由于本文制作不易,请尊重劳动成果,

需要源码的可以成为康康的粉丝
私信:4.20网页源码 即可获取

不会做点我

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/64013.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

520送什么给男朋友最好?送男朋友礼物排行榜

520要到啦&#xff0c;还没给男朋友准备好礼物的小伙伴儿们就赶紧收藏好这份超级礼物清单吧&#xff01;就我个人而言&#xff0c;有意义的礼物无非是让他感受到你的心意&#xff0c;大多数男生一般都不太会期待女生送来多珍贵的礼物&#xff0c;相反的是&#xff0c;他们更期待…

520送男朋友什么礼物比较好、520给男朋友的实用性礼物

520节日马上来临&#xff0c;各位女生朋友有没有想好给男票准备爱的礼物呢&#xff1f;对于男生来说&#xff0c;最关注的莫过于数码产品和游戏&#xff0c;所以准备礼物的时候往这个方向靠拢准没错&#xff01;但是部分女生对于这方面可能还是小白&#xff0c;所以小编在这里也…

七夕送女朋友什么礼物比较有意义!女生都拒绝不了的礼物推荐篇

马上就是七夕啦&#xff01;是不是很多朋友们都在想着到底送什么礼物给对方才会更合适呢&#xff01;别担心&#xff0c;身为一个好物推荐博主&#xff0c;在各种节日已经来去自由&#xff0c;对于女孩子喜欢的东西&#xff0c;那当然是女孩子更懂女孩子啦&#xff01;下面就是…

python程序员怎么给女朋友准备礼物

先来展示一下效果图&#xff1a; 不知道大家给女朋友的备注是什么&#xff1f;下面看看我的备注。 这是我给女朋友的备注&#xff1a; 再来看看给女朋友一个发射爱心的图片&#xff0c;这个叫“既许一人以偏爱&#xff0c;愿尽余生之慷慨”&#xff0c; 看完了发射爱心&#x…

生日快乐送女朋友的网页生日礼物模版

生日快乐送女朋友的网页生日礼物模版 Demo: http://sylvanding.online/happy-birthday-20221120 仓库&#xff1a;https://github.com/sylvanding/happy-birthday-20221120 参考 背景 https://codepen.io/arcs/pen/XKKYZW蛋糕 https://codepen.io/fixcl/pen/AaBNZB卡片 http…

520情人节到了,作为程序猿的我用代码给女朋友送了一个礼物「可以拿去送给自己喜欢的人」

写在前面&#xff1a; 我是「扬帆向海」&#xff0c;这个昵称来源于我的名字以及女朋友的名字。我热爱技术、热爱开源、热爱编程。技术是开源的、知识是共享的。 这博客是对自己学习的一点点总结及记录&#xff0c;如果您对 Java、算法 感兴趣&#xff0c;可以关注我的动态&…

现在论文用手写还是用计算机写,我需要一台计算机来写毕业论文吗?平板电脑可以用来写毕业论文吗?值得为毕业论文购买一台计算机吗?...

首先,您必须搜索信息;其次,本文是易于修改的电子版本. 但是,如果您现在不购买计算机,由于撰写论文,就无需购买计算机,只需到计算机室购买,以后再购买,下班后再购买一台更好的计算机 什么是毕业论文?您需要写多少个单词?您需要电脑吗? 根据您的,是不同的,单词的数…

计算机专业毕业设计(论文+系统)_kaic

基于SpringBoot的学生学籍管理系统的设计与实现基于SpringBoot的城乡客运服务系统的设计与实现基于Spring BootVue的蜗牛运动管理系统的设计与实现基于微信小程序的寻物平台的设计与实现基于PHP的房产经纪服务系统的设计与实现基于SpringBoot的电动车充电桩管理系统的设计与实现…

校外国外博士论文去哪里查找下载

国外博士论文可去ProQuest学位论文全文数据库查找下载&#xff0c;ProQuest学位论文全文数据库是将ProQuest公司PQDD文摘库&#xff08;现名PQDT&#xff09;中适合中国科研人员科研和教学使用的论文全文建设而成&#xff0c;并向全国百数家科研教学单位的读者提供全文服务。是…

计算机er在本科如何争取发论文?

写在前面 在本科阶段&#xff0c;GPA是衡量大家专业能力的重要标准之一&#xff0c;良好的绩点对以后继续读研深造还是找工作都有不小的帮助。GPA固然重要&#xff0c;但它并不是衡量大家能力的唯一标准&#xff0c;在大学阶段还有其他十分有含金量的事情能帮助大家提高自身实…

计算机相关专业本科毕业论文撰写指南

版权声明 本文原创作者&#xff1a;谷哥的小弟作者博客地址&#xff1a;http://blog.csdn.net/lfdfhl 本科毕业论文背景 本科毕业论文是大学本科生完成学业的重要标志之一。通常情况下&#xff0c;本科毕业论文需要经过以下几个步骤&#xff1a; 选题&#xff1a;选择一个合适…

2023届计算机专业弄潮儿如何快速找毕业论文文献?

人生苦短&#xff0c;我用Python 一、准备工作 软件选择 Python3.8pycharm 模块 requests #模拟请求 Selenium # 浏览器自动化操作winr打开搜索框&#xff0c;输入cmd按确定打开命令提示符窗口&#xff0c;输入pip install 加上你要安装的模块名&#xff0c; 回车即可安…

记录一下计算机专业毕业论文用到的在线网站

写在前面的话&#xff1a; 在毕业设计完成期间&#xff0c;用到的还算顺手的网站&#xff0c;我个人觉得写论文的时候用WPS好一点&#xff0c;就是有点卡。 文档文献查找&#xff0c;无非就是知网&#xff0c;万方&#xff0c;学校图书馆一般都有入口。 processOn流程图&…

chatgpt赋能python:迭代器是什么?

迭代器是什么&#xff1f; 在Python编程语言中&#xff0c;迭代器是常见的编程工具。迭代器是一个对象&#xff0c;它允许您遍历容器中的元素。我们可以使用迭代器来访问序列&#xff0c;字典和集合等Python容器的元素。通过使用迭代器&#xff0c;我们可以访问容器中的元素一…

时序数据库-TDengine涛思(taos)使用以及踩坑

时序数据库 时序数据库(Time Series Database&#xff0c;TSDB) 全称为时间序列数据库。时间序列数据库指主要用于处理带时间标签&#xff08;按照时间的顺序变化&#xff0c;即时间序列化&#xff09;的数据&#xff0c;带时间标签的数据也称为时间序列数据 通过 DB-Engines…

chatgpt赋能Python-python迭代法

介绍 Python是一种被广泛应用于科学计算、人工智能、Web开发等领域的编程语言&#xff0c;迭代法(iterative method)是Python中非常重要的一种算法。迭代法是指通过不断重复执行某一操作从而逐步接近问题的解。在Python中&#xff0c;我们通常使用循环语句来实现迭代算法。 迭…

chatgpt赋能python:Python里的迭代器:如何利用这个强大的工具

Python里的迭代器&#xff1a;如何利用这个强大的工具 Python是一种流行的编程语言&#xff0c;它具有许多强大的功能来帮助您编写高效的代码。其中一个功能就是迭代器。在 Python 中&#xff0c;迭代器是从可迭代对象&#xff08;Iterables&#xff09;创建的对象&#xff0c…

自动售卖机的类型和工作流程分析

线上经济的崛起提高了人们的生活品质&#xff0c;促进了我国市场经济的发展。随着互联网的快速发展&#xff0c;线上经济资源已经饱和&#xff0c;线上和线下资源整合已经成为市场经济发展的方向&#xff0c;而自动售卖机正是线上和线下经济发展的连接纽带。 自动售卖机作为无人…

「应用案例」科聪赋能拣选AMR系统,落地新加坡新零售行业

在新零售浪潮推动下及人工智能等无人化技术日趋成熟的背景下&#xff0c;无人值守的新业态层出不穷&#xff0c;无人售货以自助购物、即时享受、移动支付等特点俘获了无数消费者。在互联网时代&#xff0c;无人售货在年轻消费群体中的接受度很高。 然而当货柜缺货时&#xff0c…

自动售卖系统开发系列——人脸识别自动售卖机三代BrotherSharp

大纲&#xff1a; 售卖机三代BrotherSharp的简介 售卖机三代BrotherSharp的方案介绍 #系统整体组成 #软件平台 #硬件平台 售卖机三代BrotherSharp的实现过程 #功能实现论述 #软件流程图 #源码 售卖机三代BrotherSharp的技术难点解析 参考文献 #售卖机三代BrotherSharp的简介…