[破事氵]如何往喵玉空间内添加一只 fumo

Ahhaha233

***本教程仅适用于喵玉殿 pc 版页面***
之前有很多朋友（并没有）问我：哇！你空间里的 fumo 好好玩啊！怎么搞的啊（捧读），实在太过热情了所以我就在百（摸）忙（鱼）之中抽了点时间水写下这篇帖子
- 首先让我们在東方Project ぬいぐるみ | グッズメーカーGift上找到心仪的 fumo
- 把 fumo 的图片下载下来，找个在线 ai 抠图工具把背景抠了（需要透明背景）
- 把图片上传到喵玉相册（当然其他图床也行，这里以喵玉相册为例）
- 打开喵玉空间→装扮空间→模块→自由模块（随便找个没用到的），这时候下面的布局会新增一个框，找到它。鼠标移到新增的自由模块框上，这时候框的右上角会出现【编辑】按钮→点击【编辑】按钮→点击【属性】按钮，这时候会弹出来一个【编辑模块】窗口，【模块名称】改个自己喜欢的名字，把后面的代码中的【图片链接】替换成你的 fumo 图片地址然后把所有代码复制进【自定义内容】里，然后按【编辑模块】窗口右下角的【确定】，如无意外的话这时候应该能看到一只 fumo 在那里弹性十足地 duang~

       

                       

       

                                                       

<div style="width:100%;text-align: center;"><img class="fumo"src="图片链接"alt="fumo"><style>.fumo{display:inline-block;width:100%;animation:wobble 1.25s ease-in-out infinite}.fumo:hover{animation:buzz 1.5s linear infinite}@keyframes buzz{10%{transform:translateX(3px)rotate(2deg)}20%{transform:translateX(-3px)rotate(-2deg)}30%{transform:translateX(3px)rotate(2deg)}40%{transform:translateX(-3px)rotate(-2deg)}50%{transform:translateX(2px)rotate(1deg)}60%{transform:translateX(-2px)rotate(-1deg)}70%{transform:translateX(2px)rotate(1deg)}80%{transform:translateX(-2px)rotate(-1deg)}90%{transform:translateX(1px)rotate(0)}100%{transform:translateX(-1px)rotate(0)}}@keyframes wobble{50%{transform:translateY(12px)scale(1.02, 0.95)}60%{transform:translateY(-6px)}70%{transform:translateY(4px)}80%{transform:translateY(-2px)}90%{transform:translateY(1px)}100%{transform:translateY(0)}}</style></div> 复制代码

       

- 确认无误后点击页面右上角的【保存】按钮，至此完工

---

一些需要注意的点：
- 图片地址请保持在 112 个字符内，因为自定义内容里只能输入 1000 个字符
- 熟悉 html 和 css 的话也可以自行修改里面的一些样式和动画数据，但请注意字符长度只有 1000
- 尽量使用喵玉相册以确保可用性，如果使用的是喵玉相册的话可以参照以下步骤获取图片链接：
- 相册找到图片，点击进入查看页面
- 点击图片下方的【查看原图】，这时会打开一个新页面，这个页面的链接就是图片的链接
- 这只 fumo 只要是能访问你空间的人都能看到（当然仅限 pc 页面）
- 至于兼容到什么版本的浏览器我也不知道，有兴趣的话可以去 caniuse 或者 mdn 查一下

#FUmo_#FUMO_#FuMo

天灵盖地灵殿

fumofumo  

江西美少女陈阳

好强b（￣▽￣）d　！膜拜大佬