有一种记录叫“时光轴”!

有一种记录叫“时光轴”!

时间轴可以用来记录你的点点滴滴,能让你回看到“那年今日”;那么用代码写一个这样的时间轴需要多久的时间?或者为你自己,你的家人,留下一份可以保存在服务器上的时光的记忆!

有一种记录叫“时光轴”!有没有很清楚的发现这里面都需要什么?图片好说,自己可以替换,jQuery可以在网上下载的,主要就是那个CSS和html得自己写。这个写着快,用div负责内容,还有用JS“获取”当前系统时间,并显示出来;检测你要发的内容是否为“空”!

这次直接上来JavaScript的部分,不多但很长。注意圈起来的部分!上面那部分是判断文本框的,下面那个圈起来的是负责获取系统时间并显示的。有一种记录叫“时光轴”!

然后准备几个div,因为你需要在接下来的CSS中去设置这些div 的属性。这边不细数他有几个div,就说一下需要哪部分;

①文本框的头部;②文本框 ③发布按钮 ④时间轴的那条线 ⑤发布完成后的文本框显示。有一种记录叫“时光轴”!

这样下来基本上时间轴的所有要显示的东西都出来了;不过接下来咱还需要给它做个”拼接和美化”手术,比如动动他的位置,改改它的大小,CSS这块的话主要就是看个人感觉,怎么好看怎么来!

有一种记录叫“时光轴”!我天,现在才发现我写了好多好多的CSS(带上空行的有137行),中间那个分割线主要是为了分开这两个部分;能让自己的CSS代码清晰一点。或许把代码写好是一件值得你一生追求的事。

有一种记录叫“时光轴”!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值