0%

成品网站可以在这里查看(请使用手机)

0.前言

10.4晚上,写完高数线代作业终于空下来了,出了趟门后准备开始写助手的任务。

第一项搭建个人博客的任务暑假刚好做完,省事了。我选择第二项制作天气卡片的任务。因为要求把开发过程做一篇记录发表,于是就有了这篇文章。

1.数据源

拿到手的时候任务介绍里指路了可以使用高德或者彩云的天气api,但是恰逢国庆,彩云开放平台审核放假了,一直是Pending Review的状态,于是我转向高德。

高德的api很简单,一下子就弄懂,可惜它提供的更多是地图方面的服务,天气数据实在太有限了,不足以完成进阶任务。找了一晚上,选定了和风天气API,对于个人开发者的优待完全满足了我的需求。
定价
认证个人开发者有也非常快,应该是采用了AI审核,我凌晨发出申请,半分钟后就通过了,太感动了。
审核成功邮件
可靠的数据源到手,着手开始制作。

2.构思

  1. 任务建议使用原生js实现,且没有指定平台。鉴于助手在手机端更常用,而且时间很有限不足以完成响应式布局,我决定开发手机页面,这样可供参考的软件也会很多。
  2. 网络请求: 决定使用axios,因我没用过,想试试。
  3. 天气图标: 和风天气设计了一套开源的和风天气图标,仓库地址在这
    和风天气图标
    不过它只设计了天气现象相关图标,缺少诸如大气压、紫外线、日出、能见度等图标,但是先凑活着用吧。
  4. 图标展示: 推荐的Charts.js文档实在难看懂,网上搜索不到几篇教程。最后选择了Apache基金会的ECharts.js,不仅有中文文档,网上能搜到的教程也多得多。不过全功能的包体有点大,等以后可以研究一下按需引入。
  5. 页面布局:我结合了手头的华为天气和数据提供商自己的一个S和风天气app

3.动手

3.0 IDE选择

以前开发我基本就用DW或者vsc + 浏览器内建的样式编辑器,这次想尝试一下JetBrians WebStorm。

一是听说它的代码补全很强,二是杭电学生认证后有正版的全家桶可以白嫖。

3.1 简易搭建一个本地缓存

  1. 修改CSS的时候如果实时预览,每次修改保存都要重载页面,向api获取数据,不仅耗时而且浪费很多的使用次数,于是用Python在本地创建了一个服务器,作用就是读取预先保存的json再返回。测试的时候只要用本地的api就好了,反正不需要最新数据。
  • 需要注意的是,即使json和py文件都是utf8编码,也应该指定一下open函数的打开编码,比如在我这就默认用gbk打开了,显示“’gbk’ codec can’t decode byte 0xb4 in position 179: illegal multibyte sequence”。

  • 解决方案:在open()函数里传递encoding=’utf-8’的参数,例如:

    1
    with open('now.json',encoding='utf-8') as f:
  1. 由于WebStorm的本地调试服务器和Python的临时数据服务器不在一个端口上,请求会因为跨域被阻止。为了测试需要,就要设置响应头。

跨域请求被阻止

在Sanic中,中间件(Middleware)功能可以在请求到达路由的前后处理数据,以此来实现用户自定义的全局功能。在这里,因为需要进一步处理相应,所以我们将中间件绑定到“response”上。这里使用装饰器的形式实现。

1
@app.middleware('response')

然后,我们自定义一个函数设置服务器允许任何域访问资源(临时调试用,在生产环境请严格指定域来避免安全风险)。

1
2
async def fkCORS(request, response):
response.headers["Access-Control-Allow-Origin"] = "*"

现在整个中间件看起来是这样的

1
2
3
@app.middleware('response')
async def fkCORS(request, response):
response.headers["Access-Control-Allow-Origin"] = "*"

MDN上的“Access-Control-Allow-Origin”
Sanic 入门:中间件(Middleware)

  1. Sanic的服务器会绑定主机名称,如果我们的局域网ip为10.66.233.77,但设置服务器host为localhost,port为8090,则不能通过10.66.233.77:8090访问到网站,只会显示拒绝连接。
    host不对应导致拒绝连接
    如果想要用局域网设备访问,比如使用手机真机调试,我们应将host设置为局域网ip地址来规避这个问题
    1
    2
    if __name__ == '__main__':
    app.run(host='10.66.233.77',port=8090,debug=True)

注意,如果你的局域网ip地址不是固定的,记得手动在变更后修改。

3.2 使用css计算器生成线性背景渐变图

制作过程中为了顺畅衔接地图和天气卡片,需要给卡片所在容器设置一个由透明到渐变再到完全纯色的背景。同时卡片本身就需要一个渐变色。

这里就用到了“linear-gradient()” 这个函数。

linear-gradient() 函数用于创建一个表示两种或多种颜色线性渐变的图片。
注意,因为是图片,所以只能被用于图片可以被使用的地方,而并不适用于background-color等属性

卡片的渐变比较简单,从只需要从左下角颜色渐变到右上的颜色即可:

1
2
3
#overviewCard{
background-image: linear-gradient(to top right, #1C1D1F 0%, #353E4D 100%);
}

在背景用例中,我需要一部分纯透明区域,一部分渐变区域,一部分纯色区域。这些区域的范围是可以手动指定的,像这样:

1
2
3
#overviewContainer{
background-image: linear-gradient(to bottom, transparent 0%, transparent 30%, #FFFFFF 50%, #FFFFFF 100%);
}

实际效果如下:
css计算背景渐变.png

3.3 使用三目运算符动态分配类名

在24小时预报和7天预报中,为了将相邻两个容器区分开来增加可读性,需要在生成html的时候动态指配两种class
刚好上周的C语言课程学到了三目运算符,可以迁移到js上来(在js里似乎叫三元运算符或者条件运算符)。

因为具体用法相同,在C语言的课程上讲过,就不再做解释了,相关代码如下

1
2
3
4
5
6
7
let html = "";
for (let i = 0;i < Object.keys(foo).length;i++){ //Object.keys().length用来获取json中的项数
html += `<div class="${(i % 2 == 0)?"dark":"light"}"> //区分两种容器的颜色
<div>...</div>
...
</div>`;
}

实际效果如下:
三元运算符区分容器

3.4 使用css var()函数实现暗黑主题

不管是什么主题,整个网站都会遵循一定的配色标准,简单来说就是分门别类,不同作用的元素对应了不同的颜色。
当我们启用暗黑模式的时候,同一作用的元素需要切换颜色。

如何不用写两套css就能实现这种效果呢?我们可以用var()函数配合相应变量替代掉所有颜色区域。
相应的颜色可以定义在根元素节点上,比如<html>标签中,比如

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
:root{
--tb: #000000; /*正常为黑*/
--tw: #FFFFFF; /*正常为白*/
--tt: #CCCCCC; /*tip提示语*/
--qicon: #000000; /*天气图标*/
--bgc: #FFFFFF; /*背景色*/
--bgg: #CCCCCC; /*背景分割色*/
--bgd: #f0f0f0; /*背景区分色*/
--bge1: #1C1D1F; /*背景强调色*/
--bge2: #353E4D;
}
.dark{
--tb: #E0E0E0;
--tw: #FFFFFF;
--tt: #777A81;
--qicon: #E0E0E0;
--bgc: #1C1D1F;
--bgg: #2A2F35;
--bgd: #2C2D31;
--bge1: #1C1D1F;
--bge2: #353E4D;
}

其中:root 选择器匹配文档根元素。在网页中,根元素始终是<html>元素。
然后在需要切换颜色的地方,都应该显式指定相应的颜色变量:

1
2
3
4
5
6
7
8
9
#overviewCard{
background-image: linear-gradient(to top right, var(--bge1) 0%, var(--bge2) 100%);
}
#overviewSummary{
color: var(--tb);
}
#detailContainer{
background-color: var(--bgg);
}

现在我们看到,默认情况下浏览器使用:root定义的颜色组:
:root颜色组被启用
当我们给<html>添加类”dark”的时候,dark颜色组覆写了root颜色组的设置,<html>里的元素都会继承dark的变量设定:
:root颜色组被启用
这样就能实现颜色切换了。

3.5 动态切换图表的配色

很遗憾,解决了基本元素的配色问题,我们还需要单独解决图表配色。因为图表的颜色设定实际上是写在js的json中传递给函数的。
相关设置可以在ECharts的配置项手册中很详尽地看到,这里不再赘述
因为图标在创建后支持动态更改设定,所以我们使用darkCharts()和lightCharts()两个函数交替切换图表样式,缺省设置会保留之前的,但是要求格式完全一致
下面是部分实现代码,可以看到非常难以阅读(这里我使用变量来代替所有相同部分以便后期快速更改):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
function darkCharts(){
let textColor = "#E0E0E0";
let lineColor = "#454545";
let borderColor = "#000000";
let borderWidth = 1;
foreDaysChart.setOption({
yAxis: [
{
splitLine:{
lineStyle: {
color: [lineColor],
}
},
axisLabel:{
textStyle: {
color: textColor,
textBorderColor: borderColor,
textBorderWidth: borderWidth,
}
}
}
],
xAxis: [
{
axisLabel:{
textStyle: {
color: textColor,
textBorderColor: borderColor,
textBorderWidth: borderWidth,
}
}
}
],
series: [
{
label: {
color: textColor,
textBorderColor: borderColor,
textBorderWidth: borderWidth,
}
},
{
label: {
color: textColor,
textBorderColor: borderColor,
textBorderWidth: borderWidth,
}
},
]
})
}

吐槽:在新版的更新日志里已经不建议我使用textBorderColor和textBorderWidth两个属性,然而它并没有提供合适的替代属性,所以还是只能用着。害得我找了好久更优解。

3.6 模拟$(document).ready()与初始填充内容

没时间做鱼骨屏了,而且提到的方便工具都在vue或者react体系下,我也用不了。

于是我准备直接在页面加载时初始化一系列空数据,有总比没有强。然后在获取到具体数据以后或替换或更新。

这里我发现,原生的js并没有提供像jQuery库一样方便的现成函数$(document).ready()。
但是我们可以通过判断document.readyState来自己造一个轮子

当document.readyState变为interactive(可交互)时,就代表html文档已经解析完成,但是诸如图像,样式表和框架之类的子资源仍在加载。实际上这相当于$(document).ready()的状态。

当该属性值发生变化时,会在 document 对象上触发 readystatechange 事件,通过监听这个事件来运行回调函数,我们就可以模拟出一样的效果

代码如下:

1
2
3
4
5
document.onreadystatechange = function () {
if (document.readyState === "interactive") {
...
}
}

3.7 localStorage储存偏好和原生实现类的增删改

这对我而言完全是完全是新东西了,以前只接触cookie。

localStorage是持久化的本地存储,除非是通过js删除,或者清除浏览器缓存,否则数据是永远不会过期的。

而cookie是用于客户端和服务端间的信息传递,每次请求都会被附带在请求头中,因此不适宜储存大量数据或者用户个人偏好。

在这里我用localStorage储存了用户上次使用的主题偏好,可以在每次刷新时自动应用,防止闪瞎。
localStorage的增删改函数是原样从Sukka的博文你好黑暗,我的老朋友 —— 为网站添加用户友好的深色模式支持中抄来和简化的,我就不放代码了。

在简化过程中准备直接给<html>标签设置颜色组属性,结果,很遗憾发现原生js没有现成的封装,于是从网上又抄了一个。
稍微改了下,因为WebStorm疯狂说我代码不规范,变量乱声明。

技术细节到这里就结束了

4.后记

终于写到后记了,写个博文用了我4个小时,累死了(所以博客才万年不更新的)。

  • 这次因为时间仓促,额外发挥的部分要求,比如响应式页面、骨架屏、toast用户提示、webpack打包等没有实现。
  • 整个网页是国庆花了整两天搓出来的,期间学习了ECharts、axios、localStorage、css函数等各种新知识。
  • 我没有预料到新知识的学习成本还是很高的,耗时非常严重。然后在一开始寻找合适api,选择合适图表库的时候走了很长的弯路。
  • 这次是我第一次写出一整个兼具美观和功能的网页,还是很有成就感的(但是真的累,两天速成不可取)
  • 美中不足的是高德地图的JS API竟然没有提供夜间模式的地图,结果开了夜间模式首屏还是瞎眼了,唉
  • 这次是我第一次用原生js来实现一系列功能,感谢You-Dont-Need-jQuery的指导,让我看到了一系列jQuery封装后各种功能本来的样子。有些地方,原生js也能一样简洁!

最后,如果博文有错误或者错字的地方,欢迎指出(其实大概仅限于我认识的人,因为博客没有评论系统)
你可以发送邮件到asak&irain.cc(请把&换成@)
很荣幸能得到你的耐心阅读!

这周五拿手机原装耳机听歌(华为P30的3.5mm插口耳机),歌曲是用nplayer访问电脑ftp播放的。

虽然都是些128kbps~192kbps的mp3,但是因为nplayer内置DTS音效,立体声一开听感就好很多。于是突发奇想,为什么不能给电脑加一个这样的音效驱动呢?

答案3是肯定的。在网上可以找到Dolby Home Theater4或者Dolby Audio Premium,或者是DTS Audio的控制面板和驱动的安装包,于是尝试之。

先一波折腾试了Dolby Home Theater4。操作比较麻烦,得反复重启电脑,费了点力气装上以后,很失望发现这样粗暴的方法不尽如人意。播放音乐时低音稀烂听起来像爆炸了一样(笑),而且安装程序顺手把英伟达的音频驱动替换了,我的HDMI口音频输出阵亡,电流爆音中依稀挤出节奏。这显然是没救了。

又换成Dolby Audio Premium了。装完以后,发现这个软件提供的游戏、音乐、电影模式预设不能进一步调节,我又驾驭不住自定义均衡器。完事以后更发现检测不到麦克风了。就你?离谱,我又卸载了。

最后试了试DTS Audio。效果依然差的一批,低音还是像轰炸一样,开了一些声音效果,声音反而还变浑浊了。结果三个驱动都不适配电脑,得到的音效都不堪入耳……

这下就安装了Win10商店里的Dolby Access。7天试用一开,发现效果真的立马不同,比强装驱动的手推车好多了。对比了同是商店里的DTS Unbound,发现对于我的廉价耳麦来说,杜比的效果更加好一些。我于是从淘宝网薅到了便宜的兑换码(原价144¥)用上了。

真的是很不错的体验,XD。

先丢个百度百科链接吧……本来想用萌娘百科发现竟然没有这条词条???

这个游戏在我玩之前就已经停服了,好像有邀请P站上的画师画人设图,所以有时候逛P站会看到这些图片,于是我就很感兴趣了。虽然游戏关服,我我想我大概还能提取出资源文件。于是就上网搜了一下安装包,发现这个游戏的资源完全是在第一次启动游戏的时候在线下载的,而且客户端似乎在设计的时候并没考虑网络因素,我就看着这个游戏在那里加载了半小时,连不上已关闭的服务器,一个错误都没提示。——好可怜啊。

于是就只好在网上寻找资源了。正巧前段时间百度刚把15年以前的帖子全删掉,所以百度搜索一个帖子都搜不到,是没花头了,就开始用必应搜索。最终找到了一个资源帖,查看了2019/06/01的缓存,发现里面的百度网盘还能打开——也算是拯救了一个老资源。

>>这个帖子在2019/06/13已经不能在必应里被搜到,为了尽量留下帖子贡献者的痕迹,我贴出百度网盘链接

https://pan.baidu.com/s/1pJp3Koj#list/path=%2F

RT,发现这是是因为B站关注的一个红石大佬说他在贴吧发的远古红石作品全都被贴吧恶意删除而且申诉无果。

看了一下,其他贴吧也遭遇到了比较大的损伤,有些贴吧吧规都被吞了只好写了个临时的。有些贴吧的资源楼好像没了,更多我关注的贴吧好像没啥活跃度,就没有反映。

百度贴吧这次的行为非常的恶心,完全没有事先通知用户,而且似乎也不提供暂时的回复或者数据备份服务。百度搜索里有关旧帖的搜索结果也被清楚了一部分。

不过好在别的搜索引擎好像还没有迅速作词反应。这周我在必应上搜索旧帖,看到了一个2015年的资源帖,直接点击进入就只会跳转到这个吧的首页,是不可能进去了。但是必应快照可以用!最近一次必应缓存页面是在2019/06/01,那个时候这个帖子还没被删除。如果仅仅只是想获得百度网盘链接的话而不看图片的话,还是能拿到想要的东西的。

不过必应快照的不能获取百度贴吧里的图片,显示“该图片仅限百度用户内部交流”,然后百度相册这也也猝死了。不过毕竟百度已经做得这么绝了,能抢就回一点数据也算很不错了,只是必应搜索引擎下一次的缓存可能就会把这个页面覆盖掉了,这样基本就是永久性的数据丢失了。

而我的话,百度贴吧里似乎只有回复过几个帖子。现在几年前帖子全删,我基本算是被销号了?。仙子我周围的人一直都在说“贴吧已经凉了”,不知道贴吧现在是不是真的没落了,还有这次百度删帖是否也是出于这样的考虑。

因为我不是一个贴吧活跃用户,贴吧具体的现状我也难以掌握,所以最后我还是心疼那些曾经的人在贴吧写下发出的一切被销毁,曾经的各种资源和分享可能就此躺在一个人的硬盘里、一个网盘的小角落里,不会再有人补发了。

高一下这学期刚开始,好好工作了将近1年半的apache2.4坏了。由于我事先没有特意去修改配置文件,我就不知道问题出在哪里。不管是在命令行里运行还是去查errors.log,我都排查不出问题。

正好那段时间网站所在硬盘分区空间吃紧,而此时的整个站点占了40G大小,我就想着要重新部署一个网页环境,同时移动站点文件夹到另一块专存数据的硬盘里去。于是乎先删掉了php文件夹,结果发现apache又能打开了……算了这样修服务器环境不地道,我还是整个新的吧。

——正好那时候懒癌发作,考虑到上高中周末没有充足的时间来研究apache配置,我就选择了Internet Information Servic(IIS)来帮助我快速恢复网站运行。由于之前使用过一小会的IIS,我知道它的虚拟主机很方便,心里想着要把博客,网盘,后台这三个网站分开来建,就先把整个htdocs打了个压缩包扔到了新的盘里,

IIS的大部分功能都是用的图形化配置,这很方便,我再也不用啃配置文件了。用Win-acme签发好的Let’s Encrypt X3 证书可以直接在SSL证书下拉框里选到,我也成功的设置完了三个虚拟主机,归位了主要文件。

由于在重建网页环境的时候换回了i4u.moe的主域名,https的端口号也改了,导致我原来wordpress的数据库匹配不上,访问不了。我尝试过批量搜索旧域名改成新域名,还是没有用。后来发现数据库里还有一堆文章固定链接是服务器没启用https的时候的死链,心想:“这也不地道”,然后我又新建了一个wordpress。

因为之前服务器坏的事出突然,然后我的备份插件说恢复备份居然要花15$买高级版,于是只好自己从旧数据库里一点点把文章捞出来,再从就资源文件夹里把资源归位。因为我懒……五月初我才开始陆续恢复文章。结果我发现,以前在文章里分享图片的h5ai文件浏览器好像不支持IIS……

这……求(语气助词)!

因为一波百度和操作后没办法解决问题,网上也难找到简介好看的有在线浏览文件功能的目录浏览器,我只好考虑换回apache(不用nginx是因为它在windows上是用cygwin编译的,性能十足是一个残废)

本来又准备直接下载现成的网页环境安装包来方便地部署。我尝试了xampp,结果发现这个软件在部署环境时已经对httpd.conf做了很大的修改,导致我直接从百度查来的一些设置可能会给网页留一个大后门之类的东西——它自带的phpMyAdmin直接在配置文件里写入了登陆数据库的账号和密码,然后我设置的虚拟主机让这个设置页面可以直接被外网访问——这也太刺激了。由于害怕还有这样的问题,我只好决定自己重走最初的路,来配置一遍apache2.4.39+php7.3.6生产环境

我于是重新把全部要用的软件包下载了一遍,计划安装在同一个目录里。各种配置还是一样的疯狂百度,然后用windows分屏一半看教程,另一半在notepad++里改配置。因为百度那堆东西的时效性和可靠性难辨真假,我又走了那么一些弯路。简单的环境成了以后,就要开始配置SSL证书和虚拟主机。

SSL证书的配置早在第一次用apache时就已经花了将近一天来反复重试。由于印象过于深刻,我直接一遍过完事了。然后虚拟站点使我秃头……我花了整一个上午来尝试攻克这个技术性难题。网上教程多数就配置完http虚拟主机,没有介绍https的虚拟主机怎么配置,导致我反复失败了好多次。最后是参考了yudouyudou的一篇教程成功配置完毕了——不得不说,图形界面有时候是真的好,IIS处理这个主要几分钟……

所以最终我还是把网站环境迁移到了apache上。这次迁移域名端口这些设置都没变,所以wordpress很慈善地不用我重装了(欢呼?)之后稍微改了一下上传文件和连接时长限制,我又重新把所有的视频放了回来。接下来就只有小小的修缮工作了。

衷心地希望这次服务器环境能用得就一点,不然又要秃头了……

嘛嘛,毕竟这是喜爱的动漫出续集了,先撒花为敬~~~

然后第二季的番,给我的第一印象就是作画的差别和第一部挺大的。后来看评论区知道确实换了个监督。就我而言,稍稍觉得这个画风有点怪,但是不是很介意。不过总感觉花绘的性格变化很大?不知道后面的漫画是怎样的,或者有没有改编比较大?我还不清楚。在这一个方面,我还是更喜欢第一部。

OP和ED方面,我……也喜欢第一部的。文章末尾我会放出来。第一部的OPED我弄到了无字幕的。第二部就用B站片源吧。

不过经管如此,我还是很喜欢这部番剧的啦,题材以及人物等等。似乎第二部番剧会有挺多新的人物加入,希望后面的更新能让我欣喜XD.放几张图片吧XD.

接下来是视频时间——

第一部OP

第一部ED

第二部OP

第二部ED

我也没想到自己会玩出个这样的结局。感觉很可惜啊,心情也不大好。

先说起这个结局。是在8月11日(游戏内时间)出现的。一早上起床实际上就进入了这个结局,中间没有需要做选择的地方。

沙耶得知将伊那砂乡与外界隔开的结界已经没有了修复的可能性,而唯一的办法就是作为人身御供献出自己的生命来守护住结界,从而保护伊那砂乡里1000多位居民。

尽管所有人都极力反对,希望沙耶不要做出这样的事情。但是沙耶最终选择在夜晚的庭院里邂逅安纲,两人一同赴死……

所以事实上,始终不与任何角色结合就会迎来这样的结局。我也是第一次玩乙女,看来选择不够明智。

这个游戏又告诉了我眯眯眼的都是怪物。 虽然我开始玩的时候就想到了,没想到是真的。唉。

视频在下方,其中第二段可能会虐死你,请酌情观看(我也难受死了。)最后一段是提示。

如果你不能正常查看视频,刷新一下页面即可。

2015年八月,我第一次正式踏进1808班。
排好座位后,你坐在我右边的右后方。
中午自修午睡,一不小心转头,
总能和你四目相对。
过了一段时间,换了第一次座位,
你坐到了我的后面。
我只是觉得你很傻逼,hhh
很喜欢转过去跟你讲话。
因为一次根本不存在的赌注。
你就拥有了我♡
后来换了第二次座位,我记得那天是5.20。
你坐到了我后面的后面,
每天上课偷偷拿镜子看你,
之后就被班长打小报告,
告诉了老师。
很快,我的数学有了明显的进步,
我们就结束了第一学期,
来到了新七中。
过了一个暑假,
突然一切都变了样子,
你开始不理我,
一句话都不说。
终于到了运动会前,
我们又和好了,
但是关系大不如前。
你一下子进了班级前20,
而我还在后面。
2017.3.22
我终于受不了你的冷漠,
于是我们分开了七个月,
七个月里,
你没有跟我说过超过十句的话。
初三开学,
新的班主任又一次换了座位,
你坐到了我的右后方,
突然以前的那种感觉又产生,
于是我们又在一起了。
每天中午一起背书,
那篇出师表,
我背的滚瓜烂熟,
你却因为听我背,
被我带成了磕磕碰碰地背。
之后因为同学们起哄,
J知道了,
找了一次谈话后,
再一次换掉了座位,
你在我的左边的左边,
第一次月考你如愿进了年级前50,
而我也进了240,
第二次月考前,
那一星期你去散步的时候,
我找了你好几次,
可是你一次也没理我。
每次说要帮我提高成绩,
可最后,只有取笑我的份。
很好,
我发誓我一辈子也不理你了,
你喜欢谁跟我一点关系都没有,
你考你的重高,
我考我的普高,
再见[em]e400396[/em

这是一个真实的故事
男孩帅气健谈,理科很好
女孩活泼开朗,笑起来很美
我们都忘记了他们是怎么在一起的,是什么时候在一起的
只隐约记得一个下雨天
他们在楼梯的转角拥抱
说了很多只属于他们的悄悄话

他们的感情很坎坷
起起伏伏
男孩开始并不愿意承认
但是他知道自己喜欢女孩
他不愿意正视自己的感情
不愿意听到我们议论他们的名字
但是他知道他心里只有她

他们终于在一起了
进入了热恋期
在我们看不见的地方牵手,拥抱
在班级里看到他们一起进进出出的身影
直至
被班主任发现
第一次,男孩以一个满分回击了班主任
中间有数不清的阻挡
终于在一天的放学
班主任强制性要求他们分手
班主任希望女孩不要打扰男孩
男孩是考名校的高材生

班主任告诫男孩
离女孩远一点
如果女孩问他题目
坚决地拒绝她

女孩哭了
在我们看不见的地方
她回来的时候
男孩已经走了
她的眼睛红肿着
她只剩下她的朋友

她去了操场
放声大哭

他们的故事还没开始就已经结束

她告诉自己忘了她
她忘不了她
她心里有那个姓李的男孩

有没有一个借口
让他别走
别走

这就是他和她的故事