我的博客,由博丽阴阳玉守护——记一次自定义加载动画的完整实现
我的博客一直没有加载动画,每次打开网页内容都是直接蹦出来,总觉得不太美观。为了彰显我的技术力厨力,我就想自己动手,做一个旋转的红白阴阳图来当加载动画。 这图看上去挺简单的:一个完整的圆,由两条对称的阴阳鱼组成,每条鱼里还有个相反颜色的小圆点。可光是怎么实现,我就想了了两天。 一开始我异想天开,打算用四个伪元素(::before、::after)来拼出这个图形。结果在CSS里调来调去,各种对不齐,左边矫正了,右边就不知道偏到哪里去了。硬着头皮试了两个小时,只能放弃。 然后就是到处查资料,参考别人的加载动画——说来也怪,我愣是没找到一个用太极图当加载动画的例子。最后,我想到可以用三层结构来搭建这个复杂的图形。 第一层:基础圆形 + 左右分色123456.bagua { width: 120px; height: 120px; border-radius: 50%; background: linear-gradient(to right, #fff 50%, #e74c3c 50%);} 使用 border-radius: 50% 创建完美圆形 使用...
11-5 月
真亮,可惜南京多云,效果略差
随笔其一
壹这是博客的第二篇文章,自上一次更新已经过了两个月。 我可没偷懒,既然要重新搞,那肯定要比旧博客更好看。但是大佬们现有的教程基本都是butterfly 4.5.0版本以下的,现在基本用不了。 秉持着用新不用旧的理论,我就决定自己研究。但是学校又有早读又有晚自习我上的是大学还是高中啊,宿舍还离教学楼远。本来闲余时间就不多,班里自己组织的活动还不少。我每天抽点时间搞一搞博客,然后两个月就这样过去了。两个月啊,你可知我两个月是怎么过来的 贰石蒜刚到学校时正好是石蒜开花的时候,趁着军训休息时在操场边拍的。 荷花池宿舍门口有一个荷花池。南京的夏天真长,荷花到10月半才完全谢了。 鹅直出未调色,还挺有意境的。 叁第一次大会晤,也可能只有一次了,不喜欢他们聚会氛围。明明是线下聚会,却抱着只手机聊天,没人开口。犬咲夜好耶被扣帽子大师fumo合照 肆这里是后记了。还是用自建网盘当的图床,加载速度还是有点慢的记得第一次在喵玉传图片时也是用的自建网盘,那个时候还不知道https无法加载http资源,学艺不精我的错。这篇文章差不多就结束了,希望下一篇随笔不要鸽太久(
Hallo again
角落,重新亮起一盏灯这个角落安静了很久。 久到敲下键盘时,能听见生疏的回响。生活被太多东西填满,奔走,琐碎,忽明忽暗的情绪。有时想写点什么,念头像微风中的蛛丝,一晃,就断了。 于是索性停下。 停下才发现,不记录的时光,反而模糊得更快。像一叠未显影的相纸,堆在角落,想不起当时的光影。 所以,我决定回来。 不为宏大叙事,只为打捞那些日常的碎片——窗台植物新抽的嫩芽,雨后空气清冽的味道,一本读到一半发呆的书。 就在这里,为自己,重新亮起一盏小小的、温暖的灯。 你若路过,看见光,欢迎进来坐坐。