那天刷ins看到一组血红色的彼岸花照片，整个人跟被雷劈了似的定在沙发上半天没动。这玩意儿阴森又艳丽的气质实在太戳人，脑子一热就决定给自己整个彼岸花主题的个人主页。

一、开局全靠瞎折腾

先翻出祖传五年的大头显示器当画布，打开ps就开始瞎搞。花瓣素材抠得我眼珠子都要掉出来了——边缘那些毛绒绒的细丝用魔棒根本选不干净，咬着牙拿钢笔工具一根根描，描完十片花瓣右手腕疼得跟骨折似的。

调色才叫真吐血。屏幕上看是暗红色，传到手机就变成荧光粉，笔记本上又偏紫。气得我半夜两点把家里所有电子设备摊在床上挨个校色，硬调出个不管在哪个破屏幕上都不会发癫的暗红色值：#8b0000。

• 花瓣透光部分叠了四层滤色图层
• 花蕊用橘黄径向渐变画了三百多个点
• 背景墨黑色加了2%的深蓝防止变灰

二、动起来更要命

想着让花瓣飘点雨丝效果，结果CSS动画刚写三行就翻车。花瓣全挤在左上角叠罗汉，乍看还以为做了盘炒猪肝。蹲在代码前啃了五小时教程才搞明白，原来position:absolute要和父容器relative锁死，transform还要用translate3d骗显卡加速。

更绝的是给花瓣加旋转动画时，十片花瓣突然跟抽风似的满屏乱飞。手忙脚乱删代码的时候不小心按了保存，眼看着Chrome崩溃页面卡死整整半小时。发现是某个逗号打成中文全角符号，这种破事说出去能把程序员同行笑死。

三、手机党逼我上吊

电脑上看明明美得冒泡，传到手机直接崩成二维码。图片糊得连亲妈都不认识，文字小得要拿放大镜看。骂骂咧咧套上media query这层紧箍咒，光是调整横竖屏显示就折腾掉整包烟。

最抓狂的是花瓣飘落动画——手机端要么卡成PPT，要么直接不显示。把300px的大图全砍成50px缩略图，动画帧数从60砍到15，加载速度才勉强能看。这下好了，花瓣在手机上都糊成红色马赛克了。

• 笔记本加载2秒就能动
• 老爷机最多等8秒
• 手机端强制关掉3个动画层

忙活三天终于上线，发给闺蜜看得瑟。结果人家回我："网页红得跟凶案现场似的，半夜打开能吓尿。"转头就接到殡葬用品网私信问接不接单，说这风格放网上陵园贼合适。